天天看點

【JavaScript設計模式】讀書筆記——什麼是設計模式?什麼是設計模式?

文章目錄

1.什麼是設計模式?

2.js設計模式結構

3.編寫設計模式

4.js反模式

5.js設計模式的分類

什麼是設計模式?

1.什麼是設計模式?

就是一個我們如何解決問題的模闆——那些可以再許多不同的情況裡使用的模闆。

優點:

模式是行之有效的解決方法:提供固定解決方法來解決開發中出現問題

易重用:一個模式通常反映一個可适應自己需要的開箱即用的解決方案

善于表達:一般有一組詞彙和優雅的解決方案

2 . js設計模式結構

模式是最初提出的一種在兩者之間建立關系的規則:

  • 上下文環境(在此環境下産生系統的能力)
  • 配置:模式名稱 和 相應的描述
  • 上下文概述:響應使用者需要
  • 問題聲明: 了解模式意圖
  • 解決方案: 包括使用者出現問題的解決方案
  • 設計模式
  • 實作: 如何被實作的一種指引
  • 例證: 虛拟化表達
  • 例子
  • 共同條件:是否有其他模式進行支援?
  • 關系: 相似之處?
  • 已知的使用: 模式在哪裡被用到?
  • 讨論

3.編寫設計模式

模式是否實用?: 確定這個模式能夠對一些常見的問題有明确的解決方案,而不是臨時的解決方案。

保持最佳實踐: 設計需要以最佳實踐中所獲得的了解作為基礎。

設計模式對使用者來說應該是清晰的:設計模式必須對任何形式的使用者體驗都是清晰的。 因為設計模式主要服務于開發者們,是以不能強迫他們去改變原來的行為,那樣開發者們才會去使用這個模式。

需要有幾個有說服力的例子:一個好的設計模式需要有一個有說服力的例子來展示這個模式是成功的。為了廣泛使用這個設計模式,這些例子需要展示良好的設計原則。

4.js反模式

反模式的兩種觀念:

  • 描述對于一個特殊的問題,提出了一個糟糕的解決方案,最終導緻一個壞結果發生
  • 描述如何擺脫上述解決方案并能提出一個好的解決方案

當我們開發一個應用,這個工程的生命周期開始建設一直至項目完成,但一旦完成後,就進入維護階段。判斷一個解決方案的好壞要看這個團隊在這個項目上投資的技術和花費的時間。這裡被認為是好的和壞的情況下-如果應用在錯誤的情況下,一個“完美”的設計可能有資格作為一個反模式。

Javascript的反模式例子如下:

在全局上面文中定義大量污染全局指令空間的變量

在調用setTimeout和setInterval時傳遞字元串(會用eval來執行)而不是函數。

修改Object的原型 (這是最糟糕的反模式)

使用内聯Javascript

在本應使用document.createElement的地方使用document.write。document.write被錯誤的用了相當多的年頭,它有相當多的缺點,包括如果在頁面加載後執行它可能會覆寫我們的頁面。再有它不能工作在XHTML下,這也是另外一個我們使用像document.createElement這種對DOM友好方法的原因。

5.js設計模式的分類

建立型設計模式:

此模式關注于對象建立的機制,以适應工作環境的方式被建立。

基本的對象建立方法會給項目複雜化,而這些模式目的為了控制建立過程解決此問題。

  • 屬于這一類的一些模式是:構造器模式(Constructor),工廠模式(Factory),抽象工廠模式 (Abstract),原型模式 (Prototype),單例模式 (Singleton)以及 建造者模式(Builder)。

結構設計模式

關注對象組成和通常識别的方式實作不同對象之間的關系。優點在于系統的某一部分發生改變的時候,整個系統不需要重構,隻需要改相應部分。

  • 在該分類下的模式有:裝飾模式,外觀模式,享元模式,擴充卡模式和代理模式。

行為設計模式

關注改善或精簡系統不同對象的通信。

  • 行為模式包括: 疊代模式、終結者模式、觀察者模式和通路者模式
後續開始進入全部設計模式學習筆記整理,枯燥但很重要。

繼續閱讀