1.单例模式 :保证一个类只有一个实例,并提供一个访问它的全局访问点
let singleTon = (function () {
let _instance = null
function Foo() {
this.prop = "实例的属性"
}
Foo.prototype.fun = function () {
console.log("原型对象上的方法");
}
let foo = new Foo()
return {
getInstance: function () {
if (!_instance) {
_instance = new Foo()
}
return _instance;
}
}
})()
console.log(singleTon.getInstance() == singleTon.getInstance());
2.观察者模式: (发布订阅者模式) 定义对象间一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖它的对象都将得到通知.
// 对象版
let observer = {
on(eventName, callBack) { // 订阅事件
if (this.obj === undefined) {
Object.defineProperty(this, "obj", {
value: {},
enumerable: false
})
// this.obj = {} // 不考虑Object.assign()
}
if(this.obj[eventName] === undefined) {
this.obj[eventName] = [callBack]
}else {
this.obj[eventName].push(callBack)
}
},
emit(eventName) { // 发布事件
if(this.obj[eventName]) {
this.obj[eventName].forEach(element => {
element()
});
}
},
remove(eventName, callBack) { // 移除事件
if(this.obj[eventName]) {
this.obj[eventName].forEach((element,index) => {
if(element == callBack) {
this.obj[eventName].splice(index,1)
}
});
}
}
}
observer.on("test",function() {
console.log("test1");
})
observer.on("test",function() {
console.log("test2");
})
observer.on("test",function() {
console.log("test3");
});
function foo() {
console.log("移除的事件");
}
observer.on("test",foo);
observer.remove('test',foo)
observer.emit("test")
// 构造函数版
function MessageCenter() {
var _messages = {};
// 对于regist方法,它只负责注册消息,就只接收一个注册消息的类型(标识)参数就好了。
this.regist = function (msgType) {
// 判断是否重复注册
if (typeof _messages[msgType] === 'undefined') {
_messages[msgType] = []; // 数组中会存放订阅者
} else {
console.log('这个消息已经注册过了');
}
}
// 对于subscribe方法,需要订阅者和已经注册了的消息进行绑定,msgType是要被绑定的消息类型,subFn是订阅者得到消息后的处理函数
this.subscribe = function (msgType, subFn) {
// 判断是否有这个消息
if (typeof _messages[msgType] !== 'undefined') {
_messages[msgType].push(subFn);
} else {
console.log('这个消息还没注册过,无法订阅')
}
}
// 最后我们实现下fire这个方法,就是去发布某条消息,并通知订阅这条消息的所有订阅者函数
this.fire = function (msgType, args) {
// msgType是消息类型或者说是消息标识,而args可以设置这条消息的附加信息
// 还是发布消息时,判断下有没有这条消息
if (typeof _messages[msgType] === 'undefined') {
console.log('没有这条消息,无法发布');
return false;
}
_messages[msgType].forEach(function (sub) {
sub();
})
}
}
var msgCenter = new MessageCenter();
msgCenter.regist('A'); // 注册事件
msgCenter.subscribe('A', subscribeFn); // 添加订阅者
function subscribeFn(events) {
console.log(events.type, events.args); // A, fire msg
}
msgCenter.subscribe('A', subscribeFn2);
function subscribeFn2(events) {
console.log("2号也订阅了A"); // A, fire msg
}
setTimeout(function () {
msgCenter.fire('A', 'fire msg');
}, 1000);