代理模式

介绍

使用者无权访问目标对象

中间加代理，通过代理做授权和控制

示例

科学上网，访问 x.com

明星经纪人

代码演示

class ReadImg {
    constructor(fileName) {
        this.fileName = fileName;
        this.loadFromDisk(); // 初始化从硬盘中加载，模拟
    }
    display() {
        console.log('display... ' + this.fileName);
    }
    loadFromDisk() {
        console.log('loading... ' + this.fileName);
    }
}

class ProxyImg {
    constructor(fileName) {
        this.readImg = new ReadImg(fileName);
    }
    display() {
        this.readImg.display();
    }
}

let proxyImg = new ProxyImg('1.png');
proxyImg.display();

场景

网页事件代理（在事件中叫：事件委托）

jQuery $.proxy

ES6 Proxy

let stat = {
    name: '张XX',
    age: 25,
    phone: 'star: 13200000130'
}
let agent = new Proxy(star, {
    get: function(target, key) {
        if (key === 'phone') {
            // 返回经纪人自己的电话
            return 'agent: 13706887375'
        }
        if (key === 'price') {
            // 明星不报价，经纪人报价
            return 12000
        }
        return target[key]
    }
    set: function(target, key, val) {
        if (key === 'customPrice') {
			if(val < 10000) {
                throw new Error('价格太低')
            } else {
            	target[key] = val;
                return true
            }
        }
	}
})
console.log(agent.name)
console.log(agent.age)
console.log(agent.phone)
console.log(agent.price)

agent.customPrice = 15000
console.log(agent.customPrice)

代理模式 vs 适配器模式

适配器模式：提供一个不同的接口（如不同版本的插头）

代理模式：提供一模一样的接口

代理模式 VS 装饰器模式

装饰器模式：扩展功能，原有功能不变且可直接使用

代理模式：显示原有功能，但是经过限制或者阉割之后的

参考资料

• 深入设计模式