JavaScript 設計模式是一種優秀的編程思想，它可以幫助開發者更好地組織和管理代碼。在軟件開發中，設計模式不僅可以提高程序的可維護性和可重用性，還可以提高程序的可讀性和可擴展性。下面我們就一起來探討一下 JavaScript 設計模式。
首先我們先來看看最常見的設計模式之一：單例模式。單例模式是一種特殊的設計模式，它可以確保一個類只有一個實例，并且為整個系統提供一個唯一的訪問點。在 JavaScript 中，我們可以使用閉包來實現單例模式。比如我們定義一個命名空間對象來承載模塊。

var MyModule = (function() {
// 實例化變量
var _instance;
<br>
    // 模塊代碼
function init() {
// ...
return {
// ...
};
}
<br>
    // 公有方法：返回模塊的實例，如果沒有則先創建
function getInstance() {
if (!_instance) {
_instance = init();
}
return _instance;
}
<br>
    // 公有方法
return {
getInstance: getInstance
};
})();
<br>
// 使用方式
var myModule1 = MyModule.getInstance();
var myModule2 = MyModule.getInstance();
<br>
console.log(myModule1 === myModule2); // true

在這個例子中，我們使用一個閉包來限制代碼的作用域，并使用一個變量_instance來緩存模塊實例對象。當我們第一次使用MyModule.getInstance()時，調用init()函數來初始化模塊，然后把返回值賦值給_instance。在以后的調用中，直接返回_instance。
接下來我們來看看另外一種常見的設計模式：觀察者模式。觀察者模式也叫發布-訂閱模式，它是一種對象間依賴關系的設計模式，用于解耦發布者和訂閱者之間的關系。在 JavaScript 中，我們通常使用自定義事件和消息機制來實現觀察者模式。

// 定義事件通知中心
var EventEmiter = {
// 存儲事件的對象
events: {},
// 給事件添加監聽函數
on: function(event, listener) {
if (!this.events[event]) {
this.events[event] = [];
}
this.events[event].push(listener);
},
// 觸發指定事件
emit: function(event, data) {
var listeners = this.events[event];
if (listeners) {
listeners.forEach(function(listener) {
listener.call(this, data);
});
}
}
};
<br>
// 訂閱事件
EventEmiter.on('sayHello', function(message) {
console.log('Hello, ' + message);
});
<br>
// 發布事件
EventEmiter.emit('sayHello', 'world');

在這個例子中，我們定義了一個EventEmiter對象，它有on和emit兩個方法。在 JS 中，函數是一等公民，所以我們可以把函數作為參數傳遞，并使用閉包來隔離作用域。在on方法中，我們使用一個叫事件隊列的數據結構來存儲訂閱者的監聽函數，當emit方法執行時，遍歷對應事件的監聽函數并執行。
最后，我們來看看一種叫做建造者模式的設計模式。建造者模式是一種創建型模式，它可以將復雜對象構建過程拆分為多個簡單對象的組合。在 JavaScript 中，我們可以使用類來實現建造者模式。

// 定義一個基礎的菜品類
class Dish {
constructor(name, price) {
this.name = name;
this.price = price;
}
<br>
    getName() {
return this.name;
}
<br>
    getPrice() {
return this.price;
}
<br>
    //...
}
<br>
// 定義一個套餐建造器類
class MealBuilder {
constructor() {
this.meal = new Meal();
}
<br>
    addDish(dish) {
this.meal.addDish(dish);
return this;
}
<br>
    addMainCourse(name, price) {
let mainCourse = new Dish(name, price);
this.meal.addDish(mainCourse);
return this;
}
<br>
    addDrink(name, price) {
let drink = new Dish(name, price);
this.meal.addDish(drink);
return this;
}
<br>
    build() {
return this.meal;
}
}
<br>
// 定義一個套餐類
class Meal {
constructor() {
this.dishes = [];
}
<br>
    addDish(dish) {
this.dishes.push(dish);
}
<br>
    getTotalPrice() {
let total = this.dishes.reduce((sum, dish) => sum + dish.getPrice(), 0);
return total.toFixed(2);
}
<br>
    printMenu() {
console.log('-------------Menu-------------');
console.log(this.dishes.map(dish => dish.getName() + '  ' + dish.getPrice()).join('\n'));
console.log('Total Price: ' + this.getTotalPrice());
console.log('------------------------------');
}
}
<br>
// 建造一個套餐
let meal = new MealBuilder()
.addMainCourse('Hamburger', 10.98)
.addDrink('Cola', 4.87)
.build();
<br>
// 打印菜單
meal.printMenu();

這個例子中，我們使用了 ES6 中的類來實現建造者模式。首先，我們定義了一個基礎的菜品類Dish，它有名字和價格兩個屬性。然后定義一個套餐類Meal，它由多個Dish組成。最后，我們使用套餐建造器MealBuilder來組裝一個套餐。通過鏈式調用addDish方法，我們可以添加任意數量的菜品，并使用build()方法返回一個Meal實例。