新手入門，如何快速理解JavaScript

記得我剛剛學習前端的時候，對HTML和CSS學習得是很快的，一個月的時間從零到仿各種靜態頁面，從PC到移動端的頁面都寫過，然後信誓旦旦去找工作——不出意外，都被拒絕了。連續幾家公司或直接或間接給出的回覆都很明確，JavaScript是一個前端必須要會的語言。

既然如此重要，那麼究竟如何快速的理解JavaScript呢？

想要快速的理解一門語言，看視訊或許是一個不錯的選擇。但連基礎知識和概念都沒有掌握，看視訊也是如同嚼蠟，索然無味。** 難道要先看書？ **首先，看書對於掌握一門語言或技術都是必不可少的環節，有助於全盤梳理，系統性的掌握，但對於快速上手（使用）來講，還是沒那麼多的時間去整本通讀的。

所以你想怎樣？

順序很重要，可以這樣來做：
首先，概念要先理解，比如變數和基本運算，邏輯語句等，接觸了一些基本的之後，動手做幾個練習題，此步驟很快
其次，可以進入看視訊的環節，這裡也分幾點，第一要看基礎概念講解，看看老師們有什麼建議；第二，作為一個前端工程師，直接上手DOM操作吧，看看這方面相關的知識，這裡理論和實踐都很重要。
最後，看書，前面說過書是系統性的介紹一門語言，想要在這個行業混下去，看書必不可少，前面的步驟可以讓你不太理解的情況下也能出招，但想要內力大增還是需要看書的。

該怎麼做？

無論看書還是看視訊，到最後不實踐一下就沒法掌握這些知識，那麼，有什麼好的方法可以用在實踐環節？我認為最好的實踐方法是使用F12開啟你的JavaScript控制檯，切換到console，在你每一個JavaScript程式碼中加入除錯語句，在你每一個不明白的地方加入除錯語句，終極方案是看看你的JavaScript程式碼是怎麼在瀏覽器執行的。

關於JavaScript除錯方法

早期的前端工程師們沒有統一的除錯方法（很久以前的事兒），所以一般用alert()語句來輸出關鍵資訊，但這樣做有很多不方便的地方，比如該語句會直接打斷瀏覽器的執行，後來工程師們又想了一個新的辦法，在頁面中直接建立一個專門用於除錯的<div>塊，把所有的除錯資訊都輸出到該塊中，這樣做的缺點是每次除錯都要去建立這個塊，工程釋出時要刪除，不然會有非常不好的體驗。那麼到了現在，除錯有專門的JavaScript物件來負責，就是console物件。

console物件

這個物件是今天的重點，想要快速的理解JavaScript語言，就必須得利用這個工具，console物件。常見的除錯語句如下：

console.info()  //輸出除錯資訊
console.log()   //輸出除錯資訊，可接受多個引數，以逗號隔開
console.error()   //輸出錯誤資訊，控制檯為紅色資訊
console.warn()   //輸出警告資訊，控制檯為黃色資訊

其實初期幫助我們理解JavaScript只要console.log()或console.info()就夠了，在我們的程式碼中不明白不理解的地方插入除錯語句，然後執行在瀏覽器，檢視控制檯上輸出的資訊，直觀地理解，無論是this還是argument。
經常在書中或視訊中看到一些程式碼塊，其中的一些用到了this等對新手不太友好的關鍵詞，不理解？一些DOM操作中其實是在操作什麼，不理解？看下面的例子：

var date = new Date();
console.info(date);  //?
var div = document.getElementById('divID');
console.info(div);  //?
console.info(document);   //?
console.info(window);   //?
console.info(this);  //?

想知道控制檯會輸出什麼？執行一下，看一下唄

可參考以下學習資源

1. 慕課網-程式設計師的夢工廠
2. 《JavaScript DOM程式設計藝術》
3. 《JavaScript高階程式設計（第3版）》
4. 自己去搜尋一下console的詳細資訊吧