編輯推薦
Web前端開發者的內功修煉秘笈
4大社區鼎立推薦!
在這個用戶體驗為王的Web 2.0時代,Web應用所涉及的領域越來越廣,規模越來越大,需求越來越多樣化和復雜化,更新的速度也越來越快。如何纔能讓我們的應用應對規模化、多樣化、復雜化和快速變化帶來的種種問題?編寫高質量的、易於維護的Web前端代碼似乎是解決這些問題的惟一途徑。
如何纔能編寫齣高質量的、易於維護的Web前端代碼?《編寫高質量代碼:Web前端開發修煉之道》的主要內容圍繞Web前端開發的三大技術要素——HTML、CSS和JavaScript展開,深入地討論瞭編寫高質量的HTML代碼、CSS代碼和JavaScript代碼的方法、技巧、規範和實踐,從而為編寫易於維護的Web前端代碼打下堅實的基礎。希望《編寫高質量代碼:Web前端開發修煉之道》能幫助大傢從一籌莫展的前端維護工作中走齣,從此微笑地麵對需求的“變化”。
互聯網進入Web 20時代以後,Web應用敲響瞭傳統桌麵應用的喪鍾,它一路摧城拔寨,如今幾乎所有的應用都打上瞭“Web”的烙印。與之相應的,Web開發技術得到瞭空前的發展,尤其是前端技術。近年來,隨著用戶對使用體驗的要求越來越高,前端開發的技術難度越來越大,昔日設計和製作不分的網頁設計師這一職位終於“拆分”成瞭視覺設計師和前端開發工程師兩個職位,分彆嚮著藝術和技術的方嚮縱深發展。
Web前端開發工程師是一個很新的職業,在國內乃至國際上真正開始受到重視的時間也不超過5年,這類專業人纔一直供不應求。從知識體係上講,前端開發工程師需要掌握和瞭解的知識非常之多,甚至可以用龐雜來形容。作為一名沒有太多經驗的前端開發工程師,我們應該如何去全麵認識自己的工作,如何找準自己的定位,如何從閤格成為優秀,最後邁嚮卓越?《編寫高質量代碼:Web前端開發修煉之道》嘗試從如何編寫易於維護的、高質量的Web前端代碼的角度給齣答案。
如果你在思考下麵這些問題,也許《編寫高質量代碼:Web前端開發修煉之道》就是你想要的!
作為一名閤格的web前端開發工程師,究竟需要具備哪些技能和素質?為什麼說如果要精Web前端開發這一行,必須先精通十行?
在Web應用的實現代碼中,有哪些技術因素會導緻應用難以維護?
高質量的Web前端代碼應該滿足哪些條件?如何纔能提高Web前端代碼的可讀性和可重用性?
在HTML代碼中,為何要使用語義化標簽?如何檢查你使用的標簽是否語義良好?語義化標簽時應該注意哪些問題?
如何編寫CSS代碼和JavaScript代碼可以避免團隊閤作時産生衝突?
如何組織CSS文件纔能讓它們更易於管理?如何讓CSS模塊化,從而提高代碼的重用率?CSS的命名應該
注意哪些問題?何謂優良的CSS編碼風格?
如何在CSS編碼中引入麵嚮對象的編程思想?這樣做有哪些好處?
原生JavaScript和JavaScript類庫之間有何關係?如何編寫自己的JavaScript類庫?
JavaScript有哪些常見的跨瀏覽器兼容問題?如何解決這些問題?
如何組織JavaScript纔能讓代碼的結構更清晰有序,從而更易於維護?如何纔能編寫齣彈性良好的JavaScript
代碼?編寫過程中應該注意哪些問題?
JavaScript的對象編程是如何實現的?如何用麵嚮對象的方式重寫原有的代碼?
編寫高質量的JavaScript代碼有哪些實用的技巧?又有哪些常見的問題需要注意?
為瞭提高Web前端代碼的可維護性,我們應該遵循哪些規範?
更多精彩好書推薦,請點擊以下圖片查看:
內容簡介
《編寫高質量代碼:Web前端開發修煉之道》以網站重構為楔子,深刻而直接地指齣瞭Web前端開發中存在的重要問題-代碼難以維護。如何纔能提高代碼的可維護性?人是最關鍵的因素!於是《編寫高質量代碼:Web前端開發修煉之道》緊接著全方位地解析瞭作為一名閤格的前端開發工程師應該掌握的技能和承擔的職責,這對剛加入前端開發這一行的讀者來說有很大的指導意義。同時,還解讀瞭製定規範和團隊閤作的重要性。
《編寫高質量代碼:Web前端開發修煉之道》的核心內容是圍繞Web前端開發的三大技術要素——HTML、CSS和JavaScript來深入地探討編寫高質量的HTML代碼、CSS代碼和JavaScript代碼的方法、技巧、規範和實踐,從而為編寫易於維護的Web前端代碼打下堅實的基礎。這不是一本單純的“技術”書籍,沒有係統地講解Web前端開發的基礎知識,它更專注於“技巧”,探索如何為“技術”提供“技巧”。
《編寫高質量代碼:Web前端開發修煉之道》包含瞭大量的開發思想和原則,都是作者在長期開發實踐中積纍下來的經驗和心得,不同水平的Web前端開發者都會從中獲得啓發。尤其是對於那些中初級水平的讀者而言,《編寫高質量代碼:Web前端開發修煉之道》是一本不可多得的內功修煉秘籍。
作者簡介
曹劉陽,網名阿當,資深Web前端開發工程師,先後就職於中國雅虎和淘寶,現就職於新浪,一直從事Web前端開發工作,實戰經驗非常豐富,在通過提高代碼 質量來增強可維護性方麵頗有心得。精通HTML、CSS、JavaScript等前端開發技術,對ActionScript、Flex、PHP、RoR等 Web開發技術也有較深入的研究。緻力於敏捷開發實踐,喜歡讀書,閱讀過大量技術書籍;擅於總結歸納,能將各種技術融會貫通。
內頁插圖
目錄
推薦序
贊譽
前言
緻謝
第1章 從網站重構說起
1.1 糟糕的頁麵實現,頭疼的維護工作
1.2 Web標準-結構、樣式和行為的分離
1.3 前端的現狀
1.4 打造高品質的前端代碼,提高代碼的可維護性-精簡、重用、有序
第2章 團隊閤作
2.1 揭秘前端開發工程師
2.2 欲精一行,必先通十行
2.3 增加代碼可讀性-注釋
2.4 提高重用性-公共組件和私有組件的維護
2.5 冗餘和精簡的矛盾-選擇集中還是選擇分散
2.6 磨刀不誤砍柴工-前期的構思很重要
2.7 製訂規範
2.8 團隊閤作的最大難度不是技術,是人
第3章 高質量的HTML
3.1 標簽的語義
3.2 為什麼要使用語義化標簽
3.3 如何確定你的標簽是否語義良好
3.4 常見模塊你真的很瞭解嗎
3.4.1 標題和內容
3.4.2 錶單
3.4.3 錶格
3.4.4 語義化標簽應注意的一些其他問題
第4章 高質量的CSS4
4.1 怪異模式和DTD
4.2 如何組織CSS
4.3 推薦的base.css
4.4 模塊化CSS-在CSS中引入麵嚮對象編程思想
4.4.1 如何劃分模塊-單一職責
4.4.2 CSS的命名-命名空間的概念
4.4.3 掛多個class還是新建class-多用組閤,少用繼承
4.4.4 如何處理上下margin
4.5 低權重原則-避免濫用子選擇器
4.6 CSS sprite
4.7 CSS的常見問題
4.7.1 CSS的編碼風格
4.7.2 id和class
4.7.3 CSS hack
4.7.4 解決超鏈接訪問後hover樣式不齣現的問題
4.7.5 hasLayout4
4.7.6 塊級元素和行內元素的區彆
4.7.7 display: inline-block和hasLayout7
4.7.8 relative、absolute和float3
4.7.9 居中4
4.7.10 網格布局
4.7.11 z-index的相關問題以及Flash和IE6下的select元素
4.7.12 插入png圖片
4.7.13 多版本IE並存方案-CSS的調試利器IETester
第5章 高質量的JavaScript
5.1 養成良好的編程習慣
5.1.1 團隊閤作-如何避免JS衝突
5.1.2 給程序一個統一的入口-window.onload和DOMReady
5.1.3 CSS放在頁頭,JavaScript放在頁尾
5.1.4 引入編譯的概念-文件壓縮
5.2 JavaScript的分層概念和JavaScript庫
5.2.1 JavaScript如何分層
5.2.2 base層3
5.2.3 common層
5.2.4 page層4
5.2.5 JavaScript庫
5.3 編程實用技巧7
5.3.1 彈性7
5.3.2 getElementById、getElementsByTagName和getElements-ByClassName3
5.3.3 可復用性
5.3.4 避免産生副作用9
5.3.5 通過傳參實現定製3
5.3.6 控製this關鍵字的指嚮7
5.3.7 預留迴調接口
5.3.8 編程中的DRY規則
5.3.9 用hash對象傳參
5.4 麵嚮對象編程
5.4.1 麵嚮過程編程和麵嚮對象編程
5.4.2 JavaScript的麵嚮對象編程
5.4.3 用麵嚮對象方式重寫代碼
5.5 其他問題
5.5.1 prototype和內置類
5.5.2 標簽的自定義屬性
5.5.3 標簽的內聯事件和event對象
5.5.4 利用事件冒泡機製
5.5.5 改變DOM樣式的三種方式
附錄A 寫在規則前麵的話
附錄B 命名規則
附錄C 分工安排
附錄D 注釋規則
附錄E HTML規範
附錄F CSS規範
附錄G JavaScript規範
前言/序言
Web前端開發是從網頁製作演變而來的,名稱上有很明顯的時代特徵。在互聯網的演化進程中,網頁製作是Web 1.0時代的産物,那時網站的主要內容都是靜態的,用戶使用網站的行為也以瀏覽為主。2005年以後,互聯網進入Web 2.0時代,各種類似桌麵軟件的Web應用大量湧現,網站的前端由此發生瞭翻天覆地的變化。網頁不再隻是承載單一的文字和圖片,各種富媒體讓網頁的內容更加生動,網頁上軟件化的交互形式為用戶提供瞭更好的使用體驗,這些都是基於前端技術實現的。
以前會Photoshop和Dreamweaver就可以製作網頁,現在隻掌握這些已經遠遠不夠瞭。無論是開發難度上,還是開發方式上,現在的網頁製作都更接近傳統的網站後颱開發,所以現在不再叫網頁製作,而是叫Web前端開發。Web前端開發在産品開發環節中的作用變得越來越重要,而且需要專業的前端工程師纔能做好,這方麵的專業人纔近兩年來備受青睞。Web前端開發是一項很特殊的工作,涵蓋的知識麵非常廣,既有具體的技術,又有抽象的理念。簡單地說,它的主要職能就是把網站的界麵更好地呈現給用戶。
如何纔能做得更好呢?
第一,必須掌握基本的Web前端開發技術,其中包括:CSS、HTML、DOM、BOM、Ajax、JavaScript等,在掌握這些技術的同時,還要清楚地瞭解它們在不同瀏覽器上的兼容情況、渲染原理和存在的Bug。
第二,在一名閤格的前端工程師的知識結構中,網站性能優化、SEO和服務器端的基礎知識也是必須掌握的。
第三,必須學會運用各種工具進行輔助開發。
第四,除瞭要掌握技術層麵的知識,還要掌握理論層麵的知識,包括代碼的可維護性、組件的易用性、分層語義模闆和瀏覽器分級支持,等等。
可見,看似簡單的網頁製作,如果要做得更好、更專業,真的是不簡單。這就是前端開發的特點,也是讓很多人睏惑的原因。如此繁雜的知識體係讓新手學習起來無從下手,對於老手來說,也時常不知道下一步該學什麼。
目前市麵上關於Web前端開發的書主要都是針對單一技術的,本書與這些書有著本質的區彆。它主要想實現兩個目標:第一,為不太有經驗的Web前端開發工程師建立大局觀,讓他們真正瞭解和理解這個職業;第二,幫助有一定Web前端開發經驗的工程師修煉內功,通過編寫高質量的代碼來提高前端代碼的可維護性。這是很多前端開發工程師感興趣的內容。
本書的前兩章討論瞭網站重構和團隊閤作,這是很有必要的。網站重構的目的僅僅是為瞭讓網頁更符閤Web標準嗎?不是!重構的本質應該是構建一個前端靈活的MVC框架,即HTML作為信息模型(Model),CSS控製樣式(View),JavaScript負責調度數據和實現某種展現邏輯(Controller)。同時,代碼需要具有很好的復用性和可維護性。這是高效率、高質量開發以及協作開發的基礎。建立瞭這種大局觀後,學習具體技術的思路就更清晰瞭。
代碼質量是前端開發中應該重點考慮的問題之一。例如,實現一個網站界麵可能會有無數種方案,但有些方案的維護成本會比較高,有些方案會存在性能問題,而有些方案則更易於維護,而且性能也比較好。這裏的關鍵影響因素就是代碼質量。CSS、HTML、JavaScript這三種前端開發語言的特點是不同的,對代碼質量的要求也不同,但它們之間又有著韆絲萬縷的聯係。本書中包含著很多開發的思想和經驗,都是在長期的開發實踐中積纍下來的,不同水平的Web前端工程師都會從中獲得啓發。
張剋軍(著名Web前端開發工程師)
2010年4月
編寫高質量代碼:Web前端開發修煉之道 下載 mobi epub pdf txt 電子書