【JavaScript_4】JavaScript中的几个设计模式

1. 单例模式

定义
保证一个类仅有一个实例,并提供一个访问它的全局访问点。

核心思想
使用闭包缓存一个内部变量,来标记当前是否已经为这个类创建过对象。
当想创建并获取该对象时,先通过该变量判断该对象是否已被创建,如果还没创建过,则创建并返回该对象;如果已创建过,则直接返回之前创建的对象。

示例

// 形参fn是构造函数
var getSingle = function (fn) {
	var result;
	return function () {
		return result || ( result = fn.apply(this, arguments) );
	}
};

适用场景
一个单一对象。如弹窗,无论点击多少次,弹窗只应该被创建一次。

2. 工厂模式

定义、核心思想
类似用工厂函数创建对象的思想。但很大的几个区别是:
(1)用于创建对象的那种工厂函数是内部new一个对象,初始化完毕后return该对象;而工厂模式中的工厂函数,本质是一个构造函数,需要在被调用时前面配合new一起使用;
(2)用工厂函数创建出的对象,无法用instanceof判断出对象与工厂函数之间的关系;但工厂模式下,用工厂函数创建出的对象可以用instanceof方法判断出对象与工厂函数之间的关系(因为这个时候的工厂函数实际上就是一个构造函数嘛)

示例

function Factor(options) {
	this.name = options.name || "Ming";
	this.age = options.age || 20;
}

let obj = new Factor({
    name: "KK",
    age: 22
});

console.log(obj);   // 输出:Factor { name: 'KK', age: 22 }
console.log(obj instanceof Factor);  // 输出:true

适用场景
(1)当需要根据所在的不同环境轻松生成对象的不同实例时。
(2)当处理很多共享相同属性的小型对象或组件时。

3. 适配器模式

定义
是解决两个模块之间的接口不兼容的问题,对不兼容的部分进行适配。

核心思想
解决两个已有接口之间不匹配的问题。

示例

// 以后再补充吧 ~

适用场景
(1)系统需要使用现有的类,而这些类的接口不符合系统的需要。
(2)想要建立一个可以重复使用的类,用于与一些彼此之间没有太大关联的一些类,包括一些可能在将来引进的类一起工作。
(3)需要一个统一的输出接口,而输入端的类型不可预知。

4. 发布-订阅模式 / 观察者模式

定义
定义了对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知。

核心思想
取代对象之间硬编码的通知机制,一个对象不用再显式地调用另外一个对象的某个接口。
与传统的发布-订阅模式的实现方式(将订阅者自身当成引用传入发布者)不同,在JS中通常使用注册回调函数的形式来订阅

示例
JS中的事件就是经典的发布-订阅模式的实现

// 订阅
document.body.addEventListener('click', function() {
    console.log('click1');
}, false);

document.body.addEventListener('click', function() {
    console.log('click2');
}, false);

// 发布
document.body.click(); // click1  click2

适用场景
对象间存在一对多的依赖关系,当一个对象的状态发生改变时,我们想让所有依赖于它的对象都将得到通知。

参考资料:
https://www.cnblogs.com/yonglin/p/8080836.html
https://www.cnblogs.com/imwtr/p/9451129.html#o1
https://www.cnblogs.com/zhaoxinshanwei/p/8867521.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值