學習前端我推薦這5本書

勞卜發表於2016-11-16
前端

前言

作為一名前端開發人員，如果你告訴我你沒有看過任何關於前端的書籍，那麼我完全可以認為你不是一名合格的前端開發工程師。為什麼我要以“看書”來衡量合格前端的標準？因為前端作為一個特殊的極具變化與開拓性的工種，沒有較強的自我學習與思考能力，很難在這激烈又紛雜的環境裡存活而不被淘汰，而“看書”則是最基本的自我提升與補充知識的途徑。

書中自有黃金屋。不管你是想涉獵前端抑或進行系統性的學習，我都推薦大家閱讀前端的相關書籍。那麼對於想入門或者紮實前端基礎的童鞋來說我們應該挑選哪幾本適合我們的書籍呢？下面我就推薦5本帶我踏入前端併產生較大幫助的圖書供大家參考。

書單

1. Web前端開發最佳實踐

學習前端我推薦這5本書

這本書是前端開發領域的經典之作，是一本紮實前端基本功，規範我們前端程式碼的實踐性書籍。本書主要講解了HTML、CSS、Javascript以及移動端開發的最佳實踐方案，能夠對缺乏良好指導的開發者產生很大的幫助。通過閱讀本書我們可以掌握如何編寫高可讀性、高維護性、高效能的HTML、CSS以及Javascript。比如：

<!-- 如果class名稱僅作為Javascript呼叫的“鉤子”，可在名稱中新增“js”字首 -->
<ul id="js_mylist">
    <li class="menu js-active">Web前端開發最佳實踐</li>
    <li class="menu">編寫可維護的Javascript</li>
    <li class="menu">鋒利的jQuery</li>
    <li class="menu">圖解HTTP</li>
    <li class="menu">Javascript設計模式與開發實踐</li>
</ul>複製程式碼
<!-- 為了做到禁用指令碼時頁面自動跳轉，百度首頁中新增了如下程式碼 -->
<noscript>
    <meta http-equiv=refresh content="0; url=http://www.baidu.com/baidu.html?from=noscript">
</noscript>複製程式碼

2. 編寫可維護的Javascript

學習前端我推薦這5本書

本書是我極力推薦的一本幫助大家改善Javascript程式設計風格與編碼規範的書籍。那麼為什麼我們要如此注重JS的編碼規範？引用高德納的一句話就是：程式是寫給人讀的，只是偶爾讓計算機執行一下。在我們的日常開發中，往往維護程式碼的時間佔據著很大比重， 既然這樣那麼為什麼我們不在編寫程式碼的時候就重視它呢？以下是書中的兩個例子：

// 二元運算子前後必須使用一個空格來保持表示式的整潔
// 好的寫法，使用空格
for (i = 0; i < count; i++) {
    process(i);
}

// 不好的寫法，丟失了空格
for (i=0; i<count; i++) {
    process(i);
}複製程式碼
// 函式的第一個單詞名稱應該是動詞（而不是名詞），以避免與變數混淆。
// 好的寫法，第一個單詞是動詞
function doSomething() {
    // 程式碼
}

// 不好的寫法，第一個單詞是名詞
function car() {
    // 程式碼
}複製程式碼

3. 鋒利的jQuery

學習前端我推薦這5本書

這本書應該算是學習jQuery必讀的一本書，也是講解jQuery的經典之作。在正式學習這本書之前，你有必要先了解下原生Javascript，才能領悟jQuery其“write less， do more”的理念。本書深入淺出的介紹了jQuery的程式碼風格、選擇器、事件及動畫等，結合豐富的例項讓讀者能夠快速理解與應用。比如：

var $ul = $('ul').prev(); // 獲取緊鄰<ul>元素前的同輩元素
var $p = $('p').siblings(); // 獲取<p>元素的同輩元素複製程式碼
$('input').trigger('focus'); // 觸發輸入框focus事件並獲取焦點
$('input').triggerHandler('focus'); // 觸發輸入框focus事件但不會獲取焦點複製程式碼

4. 圖解HTTP

學習前端我推薦這5本書

作為和瀏覽器打交道的前端開發者，我們理應學習關於頁面從請求開始到呈現的過程和實現方式，而這本書便是快速瞭解HTTP請求背後原理的不二之選。本書結合漫畫圖片的形式講解HTTP協議、工作機制、報文及狀態碼等，圖文並茂，通俗易懂。示例：

// 請求首部欄位
Host: www.hackr.jp  // Host會告知伺服器，請求資源所處的網際網路主機名與埠號
Range: bytes=5001-10000 // 告知伺服器資源的指定範圍複製程式碼
// 響應首部欄位
Age: 600 // 告知客戶端，源伺服器在多久前建立了響應
Retry-After: 120 // 告知客戶端應該在多久之後再次傳送請求複製程式碼

5. Javascript設計模式與開發實踐

學習前端我推薦這5本書

之所以把這本書放在最後是因為閱讀這本書需要一定的Javascript基礎與功底，當我們掌握了JS的語法與編碼規範後再來翻閱此書，你會獲得別樣的收穫。那麼為什麼我們要研究設計模式？使用設計模式能夠給我們解決怎樣的問題？

我想答案和小說家為什麼很少從開始設計劇情，足球教練為什麼也很少從頭開始發明戰術一樣，他們總是沿襲了一些已經存在的模式來解決問題。下面是書中的兩種模式：

// 單例模式: 保證一個類僅有一個例項，並提供一個全域性的訪問點
var getSingle = function(fn) {
    var result;
    return function() {
        return result || (result = fn.apply(this, arguments));
    }
};複製程式碼
// 策略模式：定義一系列演算法，把它們一個個封裝起來，並且使它們可以相互替換
var strategies = {
    "S": function(salary) {
        return salary * 4;
    },
    "A": function(salary) {
        return salary * 3;
    }
};

var calculateBonus = function(level, salary) {
    return strategies[level](salary);
};複製程式碼

結語

為什麼那些工作沒幾年的人很快就遇到了自己的技術瓶頸？ 為什麼那些工作了5年以上的人還寫著一手難以維護的程式碼？我想在以上5本書中便可找到答案。

當然除了文字中推薦的5本前端入門書籍，還有很多優秀的書籍沒能在此一一推薦，請見諒。

正所謂紙上得來終覺淺，絕知此事要躬行。除了從書中汲取我們所需的知識外，我們還需要將理論化為實踐，親自動手敲擊鍵盤，從而加深並鞏固書中的知識點，才能羽化而登仙。

相關文章