設計模式概念

　　設計模式（Design Pattern）是一套被反復使用、多數人知曉的、經過分類的、代碼設計經驗的總結。

使用設計模式的目的：為了代碼可重用性、讓代碼更容易被他人理解、保證代碼可靠性。 設計模式使代碼編寫真正工程化；設計模式是軟件工程的基石脈絡，如同大廈的結構一樣。 設計模式分為三種類型，共23種：創建型模式、結構性模式、行為性模式。

創建型設計模式

　簡單工廠模式

　　簡單工廠模式又叫靜態工廠模式，由一個工廠對象決定創建某一種產品對象類的實例。主要用來創建同一類對象，無需關心其具體的實現。

// 創建籃球基類 var Basketball = function(){this.info = '籃球盛行于美國'; }// 為籃球基類添加原型方法 Basketball.prototype = {getName(){console.log('Basketball')} }// 創建足球基類 var Football = function(){this.info = '足球流行與世界' } Football.prototype = {getName(){console.log('Football')} }// 創建網球基類 var Tennis = function(){this.info = '網球' }Tennis.prototype = {getName(){console.log('Tennis')} }var SportsFactory = function(name){switch(name){case 'NBA':return new Basketball();case 'wordCup':return new Football();case 'FrenchOpen':return new Tennis();} }// 創建一個足球類 var football = SportsFactory('wordCup');football.getName(); // Football

　工廠方法模式

　　工廠方法模式：通過對產品類的抽象使其創建業務主要負責用于創建多累產品的實例。其本意是將實際創建對象工作推遲到子類當中，這樣核心類就成為了抽象類。

// 使用安全模式創建基類 var Factory = function(type, info){if(this instanceof Factory){this.name = info.namereturn this[type](info)}else{return new Factory(type, info);} }Object.assign(Factory.prototype, {Bicycle(info){this.price = 20;this.getName = function(){console.log(this.name)}},Motorcycle(type){},ElectricCar(type){} })var bicycle = Factory('Bicycle', {name: 'bicycle'});

　　這樣在以后需要添加其他類時只需要在Factory這個工廠類的原型中添加就可以了，不需要像簡單工廠模式一樣重新創建一個新的類。

　　

適用性

• 當一個類不知道它所必須創建的對象的類的時候。
• 當一個類希望由它的子類來指定它所創建的對象的時候。
• 當類將創建對象的職責委托給多個幫助子類中的某一個，并且你希望將哪一個幫助子類是代理者這一信息局部化的時候。

抽象工廠模式

　　抽象工廠模式：通過對類的工廠抽象使其業務用于對類產品簇的創建，而不負責其一類產品的實例。

// 抽象工廠 var VehicleFactory = function(subClass, superClass){// 判斷抽象工廠中是否有該抽象類if(typeof VehicleFactory[superClass] === 'function'){// 緩存類function F(){}// 繼承父類的方法和屬性F.prototype = new VehicleFactory[superClass]();// 將子類的constructor指向子類subClass.constructor = subClass;// 子類繼承父類subClass.prototype = new F();} }// 抽象類 VehicleFactory.Car = function(){this.type = 'car' } VehicleFactory.Car.prototype = {getPrice(){return new Error('抽象類方法不能使用')},getSpeed(){return new Error('抽象類方法不能使用')} }VehicleFactory.Bus = function(){this.type = 'bus' } VehicleFactory.Bus.prototype = {getPrice(){return new Error('抽象類方法不能使用')},getSpeed(){return new Error('抽象類方法不能使用')} }VehicleFactory.ElectricCar = function(){this.type = 'ElectricCar' }VehicleFactory.ElectricCar.prototype = {getPrice(){return new Error('抽象類方法不能使用')},getSpeed(){return new Error('抽象類方法不能使用')} } // 調用 // 創建子類 var Tesla = function(price, name){this.price = pricethis.name = name }VehicleFactory(Tesla, 'ElectricCar');Tesla.prototype = {getPrice(){console.log(this.price)} }var tesla = new Tesla(600000, 'tesla');tesla.getPrice()

　　抽象工廠其實是一個實現子類繼承父類的方法，在這個方法中需要通過傳遞子類以及要繼承的父類（抽象類）的名稱，并在抽象工廠方法中增加一次對抽象類存在性的判斷，如果存在，則子類繼承父類的方法（子類通過寄生式繼承父類）。

適用性

• • 一個系統要獨立于它的產品的創建、組合和表示時。
  • 一個系統要由多個產品系列中的一個來配置時。
  • 當你要強調一系列相關的產品對象的設計以便進行聯合使用時。
  • 當你提供一個產品類庫，而只想顯示它們的接口而不是實現時。

建造者模式

　　建造者模式：將一個復雜對象的構建層與其表示層相互分離，同樣的構建過程可采用不同的表示。

var Human = function(param){this.skill = param && param.skill || '保密';this.hobby = param && param.hobby || '保密'; }Human.prototype = {getSkill(){return this.skill;},getHobby(){return this.hobby;} }var Person = function(name){var _person = new Human();_person.name = name;return _person }var person = new Person('xiaohong'); console.log(person.name) console.log(person.getHobby()) 適用性

• 當創建復雜對象的算法應該獨立于該對象的組成部分以及它們的裝配方式時。
• 當構造過程必須允許被構造的對象有不同的表示時。

　原型模式

　　原型模式：用原型實例指向創建對象的類，使用于創建新的對象的類共享原型對象的屬性以及方法。

var Human = function(){}Human.prototype = {eat(){console.log(`${this.name} eating`)},say(){console.log(`${this.name}`)},run(){`${this.name} runing`} }var Student = function(name, age){Human.call(this)this.name = namethis.age = age } Student.prototype = new Human();var Teacher = function(name, age){Human.call(this)this.name = namethis.age = age } Teacher.prototype = new Human();var s1 = new Student('xiaoming', 14);var t1 = new Teacher('laoli', 33);console.log(s1.name) s1.say()

　　原型對象是一個共享的對象，那么無論是父類的實例對象或者是子類的繼承，都是對它的一個指向引用，所以原型對象才會被共享。那么對原型對象的拓展，無論是子類或者是父類的實例對象都會被繼承下來。所以說原型對象模式有一個特點就是在任何時候都可以對基類或者子類進行方法的拓展，而且所有被實例化的對象或者類都能獲取這些方法，這樣就給予我們對功能拓展的自由性。

適用性

• 當要實例化的類是在運行時刻指定時，例如，通過動態裝載；或者
• 為了避免創建一個與產品類層次平行的工廠類層次時；或者
• 當一個類的實例只能有幾個不同狀態組合中的一種時。建立相應數目的原型并克隆它們可能比每次用合適的狀態手工實例化該類更方便一些。

　單例模式

　　單例模式：又被稱為單體模式，是只允許實例化一次的對象類。

var Person = (function(){var info = {NAME: 'xiaoming',Age: 20,JOB: 'teacher'}return {get(){console.log(info.NAME)}} })()Person.get()


class Person{ static pp(){ if(Person.nnn === null){ return Person.nnn = [1,2,3,4] }else{ return Person.nnn } } constructor(){ this.newp = Person.pp() } } Person.nnn = null
var h = new Person();
var hh = new Person()
console.log(h.newp === hh.newp) // true ? 適用性

• 當類只能有一個實例而且客戶可以從一個眾所周知的訪問點訪問它時。
• 當這個唯一實例應該是通過子類化可擴展的，并且客戶應該無需更改代碼就能使用一個擴展的實例時。

?

參考資料：

　　JavaScript設計模式 張容銘著

　　設計模式——百度百科

　　

轉載于:https://www.cnblogs.com/peiyanh/p/9634369.html

總結

以上是生活随笔為你收集整理的JavaScript设计模式（一）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。