/**
* @description 代理模式,又称为委托模式,他为目标对象创造了一个代理对象,以控制对目标对象的访问
* Visitor -----------> Proxy --------------> Target
* Visitor <----------- Proxy <-------------- Target
* 如 axios 拦截器, 代理模式和装饰者模式很像,但是代理模式是会对目标对象的访问进行控制,axios拦截器可以取消
* 请求,而装饰者模式是在目标对象上添加新的功能
*
* vue2.x 通过劫持各个属性的 getter 和 setter ,在数据变化时,通过发布订阅模式发布消息给订阅者
* 触发相应的监听回调,实现数据响应式
* vu2.x 的缺点:
* 1. 无法监听利用索引直接设置数组的项
* 2. 无法监听数组的长度变化
* 3. 无法监听ES6的 Set, WeakSet, Map, WeakMap 的变化
* 4. 无法监听Class 类型的数据
* 5. 无法监听对象属性的新增或者删除
*/
// const proxy = new Proxy(target, handler)
const SuperStar = {
name: '小仙女',
scheduleFlag: false, // 档期标识 默认没空
playAdvertisement(ad) {
console.log(ad)
}
}
const ProxyAssistant = {
name: '经纪人',
scheduleTime(ad) {
const schedule = new Proxy(SuperStar, {
set(obj, prop, val) {
if (prop !== prop.scheduleFlag) return
if (!obj.scheduleFlag && val) {
obj.scheduleFlag = true
obj.playAdvertisement(ad) // 安排
}
}
})
setTimeout(() => {
console.log('小仙女有空了')
schedule.scheduleFlag = true
}, 2000)
},
playAdvertisement(reward, ad) {
if (reward > 1000000) {
console.log('没问题')
ProxyAssistant.scheduleTime(ad)
} else {
console.log('没空')
}
}
}
ProxyAssistant.playAdvertisement(10000, '广告')
网友评论