核心提示：看代码var inp = document.querySelector(input);var p = document.querySelector(p);//发布订阅对象var obj = {};//...
看代码
var inp = document.querySelector('input');
var p = document.querySelector('p');
//发布订阅对象
var obj = {};
//发布订阅事件列表
obj.list = {};
//定义订阅事件函数
obj.listen = function(eventName,fn){
obj.list[eventName] = fn;
}
//定义发布事件函数
obj.trigger = function(eventName){
obj.list[eventName]();
}
//数据
var data = {str:'hello'}
var str = data.str;
//观察数据变动从而触发所订阅事件
Object.defineProperty(data, 'str', {
get(){
return str;
},
set(newVal){
str = newVal;
console.log(data.str);
obj.trigger('go')
}
})
//订阅一个事件
obj.listen('go',function(){
p.innerText = data.str;
inp.value = data.str;
})
//数据变动
inp.oninput = function(){
data.str = this.value;
}
setInterval(function(){
data.str+='a';
},1000)
