學習前端我推薦這5本書

前言

做爲一名前端開發人員，若是你告訴我你沒有看過任何關於前端的書籍，那麼我徹底能夠認爲你不是一名合格的前端開發工程師。爲何我要以「看書」來衡量合格前端的標準？由於前端做爲一個特殊的極具變化與開拓性的工種，沒有較強的自我學習與思考能力，很難在這激烈又紛雜的環境裏存活而不被淘汰，而「看書」則是最基本的自我提高與補充知識的途徑。

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

書單

1. Web前端開發最佳實踐

這本書是前端開發領域的經典之做，是一本紮實前端基本功，規範咱們前端代碼的實踐性書籍。本書主要講解了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

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

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

// 很差的寫法，丟失了空格
for (i=0; i<count; i++) {
    process(i);
}

// 函數的第一個單詞名稱應該是動詞（而不是名詞），以免與變量混淆。
// 好的寫法，第一個單詞是動詞
function doSomething() {
    // 代碼
}

// 很差的寫法，第一個單詞是名詞
function car() {
    // 代碼
}

3. 鋒利的jQuery

這本書應該算是學習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

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

// 請求首部字段
Host: www.hackr.jp  // Host會告知服務器，請求資源所處的互聯網主機名與端口號
Range: bytes=5001-10000 // 告知服務器資源的指定範圍

// 響應首部字段
Age: 600 // 告知客戶端，源服務器在多久前建立了響應
Retry-After: 120 // 告知客戶端應該在多久以後再次發送請求

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

之因此把這本書放在最後是由於閱讀這本書須要必定的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本前端入門書籍，還有不少優秀的書籍沒能在此一一推薦，請見諒。

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

本文爲勞卜原創文章，首發於微信公衆號：前端呼啦圈（Love-FED）轉載請註明來自——微信公衆號：前端呼啦圈（Love-FED）