現在前端發展越來越快，前端科技樹越點越深，TC39 委員會在不斷審議着各種提案，ECMAScript 標準每年推出新的語言規範，瀏覽器的版本在不斷迭代推進新的技術方案，新的業務落地場景在不斷興起….
1. 前端浪潮
底層依賴不斷變化，隨之而來的是不斷變化着的上層框架。一些框架或因設計思想落後，或因功能被原生實現，或因出現了更好的替代品等種種原因衰落了，比如 jQuery、Prototype、Backbone、Ember、Underscore 等等。而新的框架應時運而生，因爲解決了當時的痛點，而得到廣泛應用，技術就這樣代代更迭，推陳出新。
不是單反不好用，而是手機太方便。不是 F14 雄貓不先進，而是現代空軍更需要多用途戰機。不是亞洲四小龍不厲害，而是中國大陸崛起了。互聯網技術的汪洋大海潮起潮落，一代代霸主顯赫一時，又低調落幕，被漸漸遺忘。這一切恍如隔世，卻又蘊含着某種必然。
前端開發者們就像非洲大草原上斷地遷徙的野牛羣，如果個體落後於大部隊，就會落入獅羣之口，爲了趕上大部隊，我們必須跑得很快，沒有終點。前端技術的不斷更迭，就像獅羣在我們後面緊追不捨，逼迫我們不斷學習新技術、新工具、新框架。
2. 以不變應萬變
但是，在這多變的世間，我們要尋找一點永恆。正如之前引起大家廣泛討論的文章 <停止學習框架> 所說：
用的編程語言雖然不一樣，但是設計方法是類似的；
用的框架雖然是不一樣的，但是設計模式是類似的；
框架經常變，但不變的是框架的設計。如果不掌握設計模式，只學習框架的用法，就是緣木求魚、刻舟求劍，明年換了新的框架，又要重新學習，事倍功半。學習設計模式讓我們掌握多變的框架背後不變的部分，掌握框架的本質，畢竟萬變不離其宗，從而在學習工作中事半功倍。
掌握設計模式，就掌握了框架的設計思想，就可以學習衆多前輩們在長期生產過程中經驗的積累，吸收他們的優秀設計理念，掌握他們解決特定問題的解決辦法，讓我們的軟件設計能力得到快速提升，從而指導我們編寫一段健壯的代碼、一個複雜的需求、一個可維護性高的系統、一個優秀的軟件架構。
設計模式是我們邁向高級前端開發者的必經之路，也是是軟件設計的基礎，想有更長遠的發展，必須夯實這座地基。JavaScript 的作用從一開始簡單的表單驗證，發展到如今大前端，複雜的業務場景對前端開發者們提出了更高的設計要求，而不僅僅是簡單的實現功能需求。
設計模式在面試中出現的頻率也越來越高，特別是三年或者以上的前端面試，特別看重軟件的設計能力。另外，如果你希望成爲項目的技術負責人，那麼軟件的設計、分層能力則是成爲合格負責人的基本要求。
前端開發者們在深入使用各種框架和工具庫後，肯定會遇到通過搜索引擎和官方文檔解決不了的各種問題，這時你會嘗試閱讀源碼，在源碼裏你就會發現各種優美的 JavaScript 用法，這些用法很多就來自於設計模式。
慕課網專欄《JavaScript 設計模式精講》是慕課聯合講師 SHERlocked93，本科和研究生畢業於北京理工大學，開源社區活躍貢獻者，擅長 Vue 技術棧，運營有技術公衆號「前端下午茶」。現在在國內一家大型國企擔任團隊前端負責人，主要負責前端技術預研、工程框架搭建、基礎設施建設等工作。
專欄在章節中會穿插介紹一些源碼中、實戰中經常出現的設計模式，幫助加深理解。
本專欄將由淺入深，從 JavaScript 的基礎開始，到傳統設計模式在 JavaScript 中的實現，最後講解一些除了傳統設計模式之外，常用在前端的其他設計模式。專欄共 29 篇文章，分爲四個部分：
基礎篇
在系統學習各設計模式之前，還需要先了解一下 JavaScript 設計模式學習離不開的前置知識，比如 this、閉包與高階函數等相關知識，然後是面向對象風格相關的繼承等知識，這些都是學習設計模式的鋪墊。
創建型模式
創建型模式關注如何創建對象，主要特點是將對象的創建和使用分離。一般抽象了對象實例化的過程，用來幫助創建對象的實例。主要包括單例模式、工廠模式、抽象工廠模式、建造者模式。
結構型模式
結構型模式關注如何將對象按某種佈局組成更大的結構。主要包括代理模式、享元模式、適配器模式、裝飾者模式、外觀模式、組合模式、橋接模式。
行爲型模式
行爲型模式關注對象之間的通信，描述對象之間怎樣相互協作，以及怎樣分配職責。主要包括髮布-訂閱模式、策略模式、狀態模式、模板方法模式、迭代器模式、命令模式、職責鏈模式、中介者模式。
一些其他模式
一些其他的模式比如 MVC、MVP、MVVM，和模塊模式、鏈模式、中間件等。
3. 文章結構
每篇設計模式的文章都大致包括下面幾個部分：
引入：設計模式不是孤立於現實世界憑空想出來的，事實上所有的設計模式都可以在現實生活中找到對應，因此將會從一個生活中具體場景引入該設計模式，以加深理解；
實現：基於上面具體場景的適當講解，代碼實現，以及可能的優化和優化過程；
分析：包括該模式的結構圖和關鍵點，該設計模式的優缺點，什麼情況下可以使用該模式，什麼情況下應儘量避免使用該模式，實際項目或源碼中遇到的設計模式實例（如果有的話）；
總結：和其他模式之間的聯繫與區別；
不論你是基礎知識薄弱，或者是單純想要提升自己，這個專欄都適合你。購買二維碼：
添加成功附贈前端資料包一份～
如果你、喜歡探討技術，或者對本文有任何的意見或建議，你可以掃描下方二維碼，關注微信公衆號“魚頭的Web海洋”，隨時與魚頭互動。歡迎！衷心希望可以遇見你。
