如何用js实现这些设计模式,并给出代码实例
时间: 2024-02-17 13:02:38 浏览: 25
设计模式是软件开发中经典的编程思想,能够提高代码的可读性、可维护性和可扩展性。在 JavaScript 中实现设计模式也非常常见,下面给出一些示例代码:
1. 单例模式
单例模式可以确保一个类只有一个实例,并提供全局访问点。
```javascript
var Singleton = (function () {
var instance;
function createInstance() {
var object = new Object("I am the instance");
return object;
}
return {
getInstance: function () {
if (!instance) {
instance = createInstance();
}
return instance;
}
};
})();
var instance1 = Singleton.getInstance();
var instance2 = Singleton.getInstance();
console.log(instance1 === instance2); // true
```
2. 工厂模式
工厂模式用于创建对象,将对象的创建与使用分离开来。
```javascript
function Car(options) {
this.doors = options.doors || 4;
this.color = options.color || "silver";
this.brand = options.brand || "unknown";
}
function CarFactory() {}
CarFactory.prototype.createCar = function (options) {
return new Car(options);
};
var factory = new CarFactory();
var car1 = factory.createCar({ doors: 2, color: "red", brand: "Ferrari" });
var car2 = factory.createCar({ doors: 4, color: "black", brand: "Toyota" });
console.log(car1);
console.log(car2);
```
3. 观察者模式
观察者模式用于解耦事件的发布与订阅,以及事件处理逻辑的分离。
```javascript
function ObserverList() {
this.observerList = [];
}
ObserverList.prototype.add = function (obj) {
return this.observerList.push(obj);
};
ObserverList.prototype.count = function () {
return this.observerList.length;
};
ObserverList.prototype.get = function (index) {
if (index > -1 && index < this.observerList.length) {
return this.observerList[index];
}
};
ObserverList.prototype.indexOf = function (obj, startIndex) {
var i = startIndex;
while (i < this.observerList.length) {
if (this.observerList[i] === obj) {
return i;
}
i++;
}
return -1;
};
ObserverList.prototype.removeAt = function (index) {
this.observerList.splice(index, 1);
};
function Subject() {
this.observers = new ObserverList();
}
Subject.prototype.addObserver = function (observer) {
this.observers.add(observer);
};
Subject.prototype.removeObserver = function (observer) {
this.observers.removeAt(this.observers.indexOf(observer, 0));
};
Subject.prototype.notify = function (context) {
var observerCount = this.observers.count();
for (var i = 0; i < observerCount; i++) {
this.observers.get(i).update(context);
}
};
function Observer() {
this.update = function () {
// ...
};
}
var subject = new Subject();
var observer1 = new Observer();
var observer2 = new Observer();
subject.addObserver(observer1);
subject.addObserver(observer2);
subject.notify("hello world");
```
以上是一些常见的设计模式的 JavaScript 实现代码示例。当然,每个设计模式的实现方式还有很多种,具体实现取决于应用场景和个人的编码习惯。