首頁 > 開發者 > JavaScript
標籤：javascript曆史和背景 js javascript組成
JavaScript的誕生背景
在上世紀90年代，歐美各國的web程式日益流行，但是當時使用者上網還都在使用電話撥接，通過
數據機，網速僅僅只有28kb/s。而web程式的展現卻日漸豐富。當時在沒有JavaScript的年代，表單
驗證等操作都是在伺服器端執行的。
舉個例子，使用者進入到一個註冊頁面，填寫使用者名稱，密碼，個人資訊，點擊註冊，好，事大了。。。
發送資訊，開始網路傳輸，等了十幾秒，伺服器接到瀏覽器用戶端發送的資訊，開始處理，然後把處理
資訊返回用戶端瀏覽器，使用者突然發現提示使用者名稱填寫要大寫字母開頭，修改，然後點擊註冊。。。
然後重複上一步，最後又提示密碼太短，不夠安全。僅僅一個簡單的註冊頁面可能在表單驗證花費大量
時間，浪費頻寬。這對使用者是難以忍受的。
在這種背景下，社會急需一種用戶端語言，來解決這類問題。當時處在科技前沿的Netscape（網景公司）
開始著手開發一種用戶端指令碼語言。
1995 就職於Netscape的布蘭登.愛奇在網景瀏覽器2.0中開發一個稱之為 LiveScript 的指令碼語言，為了
趕上和媒體熱炒Java的熱潮，改名為JavaScript。從此JavaScript誕生。
JavaScript標準化
人怕出名豬怕壯，JavaScript一經推出在社會引起廣泛關注，不同版本的JavaScript語言紛紛出來，
當時比較流行的有：Netscape Navigator 3.0 中的 JavaScript、IE 中的 JScript 以及 CEnvi 中的
ScriptEase。這對於程式員來說如果要開發一個對方便使用的web程式，或許相容性就是一大工作量，畢竟
有的使用者用的瀏覽器各不相同，而內嵌的指令碼語言也不相同。對於JavaScript標準化就凸顯出來了。
在1997年，由sun，微軟，等一些科學家，程式員，坐在一起開了個會，並制定了ECMA-262標準，正常化
ECMAScript從此瀏覽器各大廠商將ECMAScript作為JavaScript實現的基礎。
JavaScript的組成
JavaScript由ECMAScript，BOM,DOM三部分組成，其中ECMAScript為JavaScript的核心，規定了JavaScript
的變數，類型，關鍵字，函數等基礎語言。DOM為文檔操作對象，是操作HTML，XML元素的介面，BOM為瀏覽器
對象，可以對瀏覽器視窗進行訪問和操作。
在ECMA262標準只定義了ECMAScriptd的標準，對於DOM。BOM並沒有標準，BOM,DOM是屬於宿主對象。
所謂的宿主就是JavaScript的運行環境，比如現在所看到的瀏覽器。不同的瀏覽器對於宿主對象略有差別
所以做前端面臨最痛苦的相容問題主要就是BOM和DOM引起的。
JavaScript基礎知識
1.區分大小寫
var a ;var A 是不一樣的
function myName() function myname()也是不一樣的
2.每行以分號結尾，分號可有可無，但為了保持良好編碼習慣，我們以後都加上‘;‘。
var a = ‘hello‘
var b = ‘javascript‘;
3.JavaScript注釋
單行注釋//
多行注釋/*開頭 */結尾。中間部分都是被注釋掉的內容
//var a = ‘123‘ 我被注釋掉了，不會被執行。
/* var b =‘123‘;
alert(b);
*/ 中間部分都被注釋掉了不會執行
4.{}花括弧表示代碼塊，代碼塊裡封裝一系列語句
window.onload()=function(){
…………語句
}
if(true){
…………語句
}
5 忽略多餘空白
var num = 1;
var num=1;
var result = 1+ 2;
var result = 1 + 2;
第一個JavaScript例子
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
function sayHello(){
//我是注釋
var a = "hello, javascript!!!";
alert(‘我先執行‘);
alert(a);
}
</script>
</head>
<body>
<input type="button" value=‘hello‘ onclick="sayHello()"/>
</body>
</html>
JavaScript代碼嵌入位置
JavaScript代碼要放到<script>…………<script>標籤裡面
<script></script>標籤的嵌入位置可以在head中也可在body中
以上代碼雖然沒什麼問題，但是稍微變一變，就會存在問題。
我們在上一個例子的基礎上多加一個字型內容改變的小功能。
為了避免一些由於載入順序而擷取不到元素的問題。我們要不然在body
中嵌入js代碼，要不然使用windo.onload函數來延遲js代碼載入。
改進JavaScript例子sayHello
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
window.onload = function(){
document.getElementById(‘p1‘).innerHTML=‘sayHello‘;
}
//document.getElementById(‘p1‘).innerHTML=‘sayHello‘;此處由於載入順序p1擷取不到出錯。
function sayHello(){
//我是注釋
var a = "hello, javascript!!!";
alert(‘p1標籤已經存在‘);
alert(a);
}
</script>
</head>
<body>
<p id=‘p1‘>hello,javascript</p>
<input type="button" value=‘hello‘ onclick="sayHello()"/>
<script>
//document.getElementById(‘p1‘).innerHTML=‘sayHello‘;
</script>
</body>
</html>
限於文章篇幅原因，這裡僅僅介紹冰山一角。由於筆者的水平有限，編寫時間也很倉促，
文中難免會出現一些錯誤或者不準確的地方，不妥之處懇請讀者批評指正
說在最後的話：
本博會開一個JS專欄，長期更新，由淺入深帶大家系統的學習JavaScript，做出多彩的JS特效。
如果對你有用就關注一下吧。
想觀看JS視頻的博友可以在51CTO上搜尋《多彩JavaScript》。
本文出自 “心有猛虎，細嗅薔薇” 部落格，請務必保留此出處http://zhangdongxu.blog.51cto.com/12029530/1955944
由淺入深JavaScript——JavaScript的誕生背景
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
