今天開始js的內容整理，跳動在網頁裏的精靈就是它了。
一、簡介
1、什麼是Javascript
JavaScript 是一種具有面向對象能力的、解釋型的程序設計語言。更具體一點，它是基於對象和事件驅動並具有相對安全性的客戶端腳本語言。它的主要目的是，驗證發往服務器端的數據、增加 Web 互動、加強用戶體驗度等。
2、JavaScript發展史
大概在1992年,一家稱作Nombas的公司開始開發一種叫做C– –(C-minus-minus,簡稱Cmm)的嵌入式腳本語言。保持與C（和C++）的相似性，以便開發人員能很快學會。Nombas最終把Cmm的名字改成了ScriptEase，而這種嵌入式腳本的理念也成爲因特網的一塊重要的基石。
1995年，Netscape(網景)公司的布蘭登與Sun 公司聯手開發一個稱LiveScript 的腳本語言。爲了營銷便利，之後更名爲 JavaScript(目的是在 Java 這課大樹下好乘涼)。一個完整的JavaScript實現是由以下3個不同部分組成的。
ECMAScript定義的只是這門語言的基礎，與Web瀏覽器沒有依賴關係，而在基礎語法上可以構建更完善的腳本語言。JavaScript的運行需要一定的環境，脫離了環境JavaScript代碼是不能運行的，JavaScript只能夠寄生在某個具體的環境中才能夠工作。JavaScript運行環境一般都由宿主環境和執行期環境共同構成，其中宿主環境是由外殼程序生成的，如Web瀏覽器就是一個外殼程序，它提供了 一個可控制瀏覽器窗口的宿主環境。執行期環境則由嵌入到外殼程序中的JavaScript引擎（或稱爲JavaScript解釋器）生成，在這個環境中 JavaScript能夠生成內置靜態對象，初始化執行環境等。
Web瀏覽器自定義的DOM組件，以面向對象方式描述的文檔模型。DOM定義了表示和修改文檔所需的對象，這些對象的行爲和屬性以及這些對象之間的關係。DOM對象，是我們用傳統的方法(javascript)獲得的對象。DOM屬於瀏覽器，而不是JavaScript語言規範裏的規定的核心內容。
前面的DOM是爲了操作瀏覽器中的文檔，而爲了控制瀏覽器的行爲和操作(BOM)，瀏覽器還提供了BOM（瀏覽器對象模型）。
簡單的說就是下面這種結構
ECMAScript(基礎語法)
JavaScript的核心語法ECMAScript描述了該語言的語法和基本對象
BOM(瀏覽器對象模型)
瀏覽器對象模型（BOM）—— 描述了與瀏覽器進行交互的方法和接口
DOM(文檔對象模型)
文檔對象模型（DOM）—— 描述了處理網頁內容的方法和接口
3、開發工具
瀏覽器: chrome或火狐
Hbuilder或Eclipse等等
進入“控制檯”console：瀏覽器F12
控制檯的作用
console對象代表瀏覽器的JavaScript控制檯，用來運行JavaScript命令，常常用來顯示網頁運行時候的錯誤信息。Elements用來調試網頁的html和css代碼。
二、語法格式
1、註釋
可以將註釋插入 JS代碼中，這樣可以提高其可讀性，使代碼更易被人理解。瀏覽器會忽略註釋，也不會顯示它們。
|
1 2 3 4 5 6 7 |
|
2、行內式
行內式將JS定義在具體html元素中。以行內式寫的JS耦合度高，這種寫法會使得頁面非常雜亂無章，真正開發中實際上是使用嵌入式或引入外部JS文件的方式。
|
1 2 |
|
3、嵌入式
嵌入式通過在html頁面內容開闢一段屬於JS的代碼區域，通常做法爲在<body>標籤中嵌套<script>標籤。
|
1 2 3 4 5 |
|
4、引入外部文件
在實際開發當中，很多時候都使用引入外部文件，這種形式可以使html頁面更加清晰。
|
1 2 3 4 5 6 7 8 |
|
注意：
我們可以將JavaScript代碼放在html文件中任何位置，但是我們一般放在網頁的head或者body部分。由於頁面的加載方式是從上往下依次加載的，而這個對我們放置的js代碼運行是有影響的。放在<head>部分，最常用的方式是在頁面中head部分放置<script>元素，瀏覽器解析head部分就會執行這個代碼，然後才解析頁面的其餘部分。放在<body>部分，JavaScript代碼在網頁讀取到該語句的時候就會執行。
在已經有了寫好的js代碼，直接使用是非常簡單的，但是我們需要學習的是JS的寫法，使用JS的基本語法，結合BOM和DOM兩種接口來操作瀏覽器中的元素，使得我們的頁面能夠具有動態的效果。
三、JavaScript基礎語法
1、語句
JavaScript程序的執行單位爲行（line），也就是一行一行地執行。一般情況下，每一行就是一個語句。
語句（statement）是爲了完成某種任務而進行的操作，語句以分號結尾，一個分號即表示一個語句結束。多個語句可以寫在一行內（不建議這麼寫代碼），但是一行寫多條語句時，語句必須以分號結尾。
表達式不需要分號結尾。一旦在表達式後面添加分號，則JavaScript引擎就將表達式視爲語句，這樣會產生一些沒有任何意義的語句。
|
1 2 3 4 |
|
2、關鍵字
關鍵字也稱保留字，是被JavaScript徵用來有特殊含義的單詞
3、標識符
標識符就是一個名字，用來給變量和函數進行命名，有特定規則和規範
規則：由Unicode字母、_、$、數字、中文組成
a. 不能以數字開頭
b. 不能是關鍵字和保留字
c. 嚴格區分大小寫
規範：
見名知意
駝峯命名或下劃線規則
var a = 1; var abc = "1"; var _test = "test"; var $name = "張三"; var age1 = 18; var userPwd = "a1b2c3"; var USER_AGE = 20;
4、變量
變量即一個帶名字的用來存儲數據的內存空間，數據可以存儲到變量中，也可以從變量中取出數據。萬能的盒子。
變量的聲明
JavaScript是一種弱類型語言，在聲明變量時不需要指明數據類型，直接用var修飾符進行聲明。
變量聲明和賦值：
|
1 2 3 4 5 |
|
變量的注意點
a. 若只聲明而沒有賦值，則該變量的值爲undefined。
|
1 2 |
|
b. 變量要有定義才能使用，若變量未聲明就使用，JavaScript會報錯，告訴你變量未定義
|
1 2 3 |
|
c. 可以在同一條var命令中聲明多個變量。
|
1 2 3 4 |
|
d. 若使用var重新聲明一個已經存在的變量，是無效的。
|
1 2 3 |
|
e. 若使用var重新聲明一個已經存在的變量且賦值，則會覆蓋掉前面的值
|
1 2 3 |
|
f. JavaScript是一種動態類型、弱類型語言，也就是說，變量的類型沒有限制，可以賦予各種類型的值。
|
1 2 |
|
先就到這裏，本文首發於公衆號 嗨碼歌，關於持續關注。
更多技術文章學習視頻教程獲取，請來 上海尚學堂