js的几种设计模式

JavaScript 中常见的设计模式有以下几种：

1. 单例模式：

概念：确保一个类只有一个实例，并提供一个全局访问点来获取该实例。
优势：节省系统资源，避免重复创建对象。
应用场景：例如全局配置对象、日志记录器。
示例代码：

const Singleton = (function () {
    let instance;
    function createInstance() {
        const object = new Object("I am the instance");
        return object;
    }
    return {
        getInstance: function () {
            if (!instance) {
                instance = createInstance();
            }
            return instance;
        }
    };
})();

2. 工厂模式：

概念：定义一个用于创建对象的接口，让子类决定实例化哪一个类。
优势：增加代码的灵活性和可扩展性。
应用场景：根据不同的条件创建不同类型的对象。
示例代码：

function Car(make, model, year) {
    this.make = make;
    this.model = model;
    this.year = year;
}

function Truck(make, model, year) {
    this.make = make;
    this.model = model;
    this.year = year;
}

function VehicleFactory() {}

VehicleFactory.prototype.vehicleClass = Car;

VehicleFactory.prototype.createVehicle = function (make, model, year) {
    if (this.vehicleClass) {
        return new this.vehicleClass(make, model, year);
    } else {
        throw new Error('Invalid vehicle class');
    }
};

3. 观察者模式：

概念：定义了一种一对多的依赖关系，让多个观察者对象同时监听某一个主题对象，当主题对象发生变化时，它的所有依赖者（观察者）都会收到通知并自动更新。
优势：实现对象间的松耦合，当一个对象状态改变时自动通知其他依赖对象。
应用场景：事件监听和处理、实时数据更新。
示例代码：

class Subject {
    constructor() {
        this.observers = [];
    }

    addObserver(observer) {
        this.observers.push(observer);
    }

    removeObserver(observer) {
        const index = this.observers.indexOf(observer);
        if (index!== -1) {
            this.observers.splice(index, 1);
        }
    }

    notify(data) {
        this.observers.forEach(observer => observer.update(data));
    }
}

class Observer {
    update(data) {
        console.log('Received data:', data);
    }
}

4. 模块模式：

概念：通过闭包来封装私有变量和方法，只暴露必要的接口。
优势：保护内部数据，避免全局污染。
应用场景：创建具有私有属性和方法的对象。
示例代码：

const Module = (function () {
    let privateVar = 'I am private';

    function privateMethod() {
        console.log(privateVar);
    }

    return {
        publicMethod: function () {
            privateMethod();
        }
    };
})();

5. 代理模式：

概念：为其他对象提供一种代理以控制对这个对象的访问。
优势：可以在访问对象时进行一些额外的操作，如权限控制、缓存等。
应用场景：延迟加载、访问控制。
示例代码：

class Image {
    constructor(url) {
        this.url = url;
        this.loadImage();
    }

    loadImage() {
        console.log(`Loading image from ${this.url}`);
    }
}

class ImageProxy {
    constructor(url) {
        this.url = url;
        this.image = null;
    }

    showImage() {
        if (!this.image) {
            this.image = new Image(this.url);
        }
        this.image.loadImage();
    }
}

这些设计模式在不同的场景中可以帮助开发者更有效地组织和管理代码，提高代码的可维护性和可扩展性。但过度使用或不恰当使用也可能导致代码复杂性增加。