一、初始JavaScript

1.1 JavaScript歷史

• 布蘭登·艾奇（Brendan Eich，1961年~）。
• 神奇得大哥在1995年利用10天完成得JavaScript設(shè)計。
• 網(wǎng)景公司最初命名為LiveScript，后來在與Sun合作之后將其改名為JavaScript。

1.2 JavaScript是什么

• JavaScript是世界上最流行得語言之一，是一種運(yùn)行在客戶端得腳本語言（Script是腳本的意思）
• 腳本語言：不需要編譯，運(yùn)行過程中由js解釋器（js引擎）逐行來進(jìn)行解釋并執(zhí)行

• 現(xiàn)在也可以基于Node.js技術(shù)進(jìn)行服務(wù)器端編程

  
  
  image.png

1.3 JavaScript的作用

• 表單動態(tài)校驗（密碼強(qiáng)度檢測）（）
• 網(wǎng)頁特效
• 服務(wù)端開發(fā)（Node.js）
• 桌面程序（Electron）
• App（Cordova）
• 控制硬件-物聯(lián)網(wǎng)（Ruff）
• 游戲開發(fā)（cocos2d-js）

1.4 HTML/CSS/JS的關(guān)系

• HTML決定網(wǎng)頁結(jié)構(gòu)和內(nèi)容（決定看到什么），相當(dāng)于人的身體
• CSS決定網(wǎng)頁呈現(xiàn)給用戶的模樣（決定好不好看），相當(dāng)于給人穿衣服、化妝

• 實現(xiàn)業(yè)務(wù)邏輯和頁面控制（決定功能），相當(dāng)于人的各種動作

  
  
  image.png

1.5 JS的組成

image.png

1.5.1 ECMAScript

是由ECMA國際（原歐洲計算機(jī)制造商協(xié)會）進(jìn)行標(biāo)準(zhǔn)化的一門編程語言，這種語言在萬維網(wǎng)上應(yīng)用廣泛，它往往被稱為JavaScript或JScript，但實際上后兩者是ECMAScript語言的實現(xiàn)和擴(kuò)展。

image.png

1.5.2 DOM---文檔對象模型

，是W3C組織推薦的處理可擴(kuò)展標(biāo)記語言的。通過DOM提供的接口可以對頁面上的各種元素進(jìn)行操作（大小、位置、顏色等）。

1.5.3 BOM---瀏覽器對象模型

（Browser Object Model，簡稱BOM）是指瀏覽器對象模型，它提供了獨立于內(nèi)容的、可以與瀏覽器窗口進(jìn)行互動的對象結(jié)構(gòu)。通過BOM可以操作瀏覽器窗口，比如彈出框、控制瀏覽器跳轉(zhuǎn)、獲取分辨率等。

1.6 JS初體驗

JS有3種書寫位置，分別為行內(nèi)、內(nèi)嵌和外部。

1.6.1 行內(nèi)式 JS

<input type="button" value="點我試試" onclick="alert('hello world')" />

• 可以將單行或少量JS代碼寫在HTML標(biāo)簽的事件屬性中（以on開頭的屬性），如：onclick
• 注意單雙引號的使用：在中我們推薦使用中我們推薦使用單引號
• 可讀性差，在html中編寫JS大量代碼時，不方便閱讀；
• 引號易錯，引號多層嵌套匹配時，非常容易弄混；
• 特殊情況下使用

1.6.2 內(nèi)嵌JS

    <script>
        alert('hello wolrd');
    </script>

• 可以將多行JS代碼寫到 <script>標(biāo)簽中
• 內(nèi)嵌JS是學(xué)習(xí)時常用的方式

1.6.3 外部js文件

<script src="my.js"></script>

• 利于HTML頁面代碼結(jié)構(gòu)化，把大段JS代碼獨立到HTML頁面之外，即美觀，也方便文件級別的復(fù)用
• 引用外部JS文件的script標(biāo)簽中間不可以寫代碼
• 適合于JS代碼量比較大的情況

1.7 JavaScript輸入輸出語法

為了方便信息的輸入輸出，JS中提供了一些輸入輸出語句，其常用的語句如下：