從零開始學 Web 之 JavaScript（一）JavaScript概述

你們好，這裏是「 Daotin的夢囈 」從零開始學 Web 系列教程。此文首發於「 Daotin的夢囈 」公衆號，歡迎你們訂閱關注。在這裏我會從 Web 前端零基礎開始，一步步學習 Web 相關的知識點，期間也會分享一些好玩的項目。如今就讓咱們一塊兒進入 Web 前端學習的冒險之旅吧！

1、JavaScript 概述

一、JavaScript簡介

JavaScript歷史
要了解JavaScript，咱們首先要回顧一下JavaScript的誕生。在上個世紀的1995年，當時的網景公司正憑藉其Navigator瀏覽器成爲Web時代開啓時最著名的第一代互聯網公司。因爲網景公司但願能在靜態HTML頁面上添加一些動態效果，因而叫Brendan Eich這哥們在兩週以內設計出了JavaScript語言。你沒看錯，這哥們只用了10天時間。

爲何起名叫JavaScript？緣由是當時Java語言很是紅火，因此網景公司但願借Java的名氣來推廣，但事實上JavaScript除了語法上有點像Java，其餘部分基本上沒啥關係。

ECMAScript
由於網景開發了JavaScript，一年後微軟又模仿JavaScript開發了JScript，爲了讓JavaScript成爲全球標準，幾個公司聯合ECMA（European Computer Manufacturers Association）組織定製了JavaScript語言的標準，被稱爲ECMAScript標準。因此簡單說來就是，ECMAScript是一種語言標準，而JavaScript是網景公司對ECMAScript標準的一種實現。

那爲何不直接把JavaScript定爲標準呢？由於JavaScript是網景的註冊商標。不過大多數時候，咱們仍是用JavaScript這個詞。若是你遇到ECMAScript這個詞，簡單把它替換爲JavaScript就好了。

JavaScript版本
JavaScript語言是在10天時間內設計出來的，雖然語言的設計者水平很是NB，但誰也架不住「時間緊，任務重」，因此，JavaScript有不少設計缺陷。

此外，因爲JavaScript的標準——ECMAScript在不斷髮展，最新版ECMAScript 6標準（簡稱ES6）已經在2015年6月正式發佈了，因此，講到JavaScript的版本，實際上就是說它實現了ECMAScript標準的哪一個版本。

因爲瀏覽器在發佈時就肯定了JavaScript的版本，加上不少用戶還在使用IE8這種古老的瀏覽器，這就致使你在寫JavaScript的時候，要照顧一下老用戶，不能一上來就用最新的ES6標準寫，不然，老用戶的瀏覽器是沒法運行新版本的JavaScript代碼的。

以上簡介來自：廖雪峯的官方網站

二、JS做用

• 驗證表單（之前的網速慢）
• 頁面特效（PC端的網頁效果）
• 移動端（移動web和app）
• 異步和服務器交互（AJAX）
• 服務端開發（nodejs）

三、語言類型

js是一種腳本語言，不只是腳本語言仍是弱類型的腳本語言。

腳本語言是一種解釋性語言，解釋性語言是相對於編譯性語言而言的。

編譯型語言：編譯代碼，把代碼編譯成CPU認識的語言(文件)，而後總體的執行。

解釋型語言：一行一行解析，解析一行執行一行。

弱類型語言：簡單理解定義一個變量，能夠有多種數據類型。（如：var）

四、前端組成

HTML：提供網頁上顯示的內容（結構）

CSS：美化網頁（樣式）

JavaScript：控制網頁行爲（行爲）

五、js組成

js = ECMAScript + DOM + BOM + 高級

ECMAScript（前身爲歐洲計算機制造商協會）：JavaScript的語法規範

DOM（Document Object Model 的文檔對象模型簡稱）：JavaScript操做網頁上元素的API

BOM（Browser Object Model 的瀏覽器對象模型簡稱）：JavaScript操做瀏覽器部分功能的API

六、js書寫位置

內嵌式：
　　通常放在body的最後，有時放在head標籤中（須要寫頁面加載函數）。
外鏈式：
　　src=」外部js文件路徑」

七、JS基礎知識

輸出語句

console.log("內容");       // 在控制檯打印輸出內容
alert("內容");                 // 彈窗顯示內容
document.write("內容");   // 在頁面書寫內容，其內容能夠識別標籤，好比：document.write("<h1>你好</h1>")

其餘語句

alert("內容");       // 彈出對話框
prompt("提示信息"); // 能夠在彈出的對話框輸入內容給後臺
confirm("")           // 彈出對話框，有是否按鈕

js代碼的注意問題：

1. 在一對script的標籤中有錯誤的js代碼，那麼該錯誤的代碼後面的js代碼不會執行。
2. 若是第一對的script標籤中有錯誤，不會影響後面的script標籤中的js代碼執行。
3. script標籤裏面能夠寫的內容：type="text/javascript" 標準寫法，或者language="JavaScript"，都是能夠省略的，緣由是在html開頭寫了遵循h5標準。
4. script標籤能夠出現多對。
5. 若是使用引入外部js文件的方式，那麼不要在script標籤裏面寫任何js代碼，若是想寫，就新開一對script標籤。