學(xué)習(xí)環(huán)境準(zhǔn)備

1. 瀏覽器選擇

TIPS：所有章節(jié)中的例子都基于 Chrome 瀏覽器環(huán)境。

推薦讀者也使用 Chrome 進(jìn)行調(diào)試學(xué)習(xí)，保證所有案例效果統(tǒng)一。

同時(shí) Chrome 也是所有主流瀏覽器中支持 JavaScript 特性較多的、速度相對(duì)較快的瀏覽器。

獲取Chrome瀏覽器

如果Chrome相關(guān)網(wǎng)頁(yè)無(wú)法訪(fǎng)問(wèn)，可以使用Microsoft Edge，新版的Edge也是基于Chromium開(kāi)發(fā)的，在特性方面幾乎可以獲得和Chrome一樣的支持。

獲取Microsoft瀏覽器

2. 開(kāi)發(fā)工具

開(kāi)發(fā)工具一般會(huì)分為兩種，一種為 IDE (Integrated Development Environment - 集成開(kāi)發(fā)環(huán)境)，另一種為編輯器（Editor）。

IDE 為開(kāi)發(fā)某一特定應(yīng)用或者多種應(yīng)用而制作的軟件，提供了代碼編輯器、調(diào)試工具等功能。

普通的編輯器則更為輕量通用，僅提供文本編輯功能。適合本 Wiki 讀者的主流 IDE 有 WebStorm、DreamWeaver。如果使用 DreamWeaver 建議選擇較新版本，舊版已經(jīng)無(wú)法滿(mǎn)足現(xiàn)階段的前端開(kāi)發(fā)。

編輯器則選擇相對(duì)較多，有Visual Studio Code、Atom、Sublime、HBuilder、Vim等。

上述編輯器含有插件、主題等功能，相對(duì) IDE 更加輕量，配合插件也能提供調(diào)試、代碼片段、代碼提示等功能，滿(mǎn)足日常開(kāi)發(fā)需求。

以下為提供部分編輯器和 IDE 的獲取地址：

• 編輯器

  • Visual Studio Code
  • Atom
  • Sublime
  • HBuilder

• IDE

  • WebStorm
  • DreamWeaver

建議初學(xué)者選擇編輯器進(jìn)行開(kāi)發(fā)，因?yàn)閷W(xué)習(xí)過(guò)程中的例子比較松散簡(jiǎn)單，IDE 更側(cè)重項(xiàng)目級(jí)別的管理。據(jù)非官方數(shù)據(jù)了解，目前大部分前端開(kāi)發(fā)者編輯器會(huì)選擇 Visual Studio Code，IDE會(huì)選擇 WebStorm。

3. 網(wǎng)絡(luò)環(huán)境

盡量確保網(wǎng)絡(luò)環(huán)境正常，部分例子可能會(huì)用到部分在線(xiàn)鏈接，如圖片。

4. 放松的學(xué)習(xí)狀態(tài)

將目光放遠(yuǎn)，看長(zhǎng)期受益。學(xué)習(xí)是一個(gè)漫長(zhǎng)的過(guò)程，慢慢吸收知識(shí)，每一章仔細(xì)閱讀主要內(nèi)容即可，剩余內(nèi)容只需要留個(gè)印象，一口容易吃成胖子，慢慢消化容易吸收。