代理模式-前端设计模式

从字面了解意思

代理： 别人来帮我实现，比如经纪人就是明星的代理
服务器跨域使用的就是代理

讲解之前写一个关于模式之间的区别
代理模式VS适配器模式

适配器模式： 提供一个不同的接口(如不同版本的插头)
代理模式： 提供一模一样的接口

代理模式VS装饰器模式

装饰器模式： 扩展功能，原有功能不变，且可以直接使用
代理模式： 展示原有的功能， 但是经过限制或者阉割之后的

  		class ReadImg {
            constructor(fileName) {
                this.fileName = fileName
                this.loading()
            }
            display() {
                console.log('display.....',  this.fileName);
            }
            loading() {
                console.log('loading.....',  this.fileName);
            }
        }

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

        let p = new ProxyImg('1.png')
        p.display()

明星经纪人模式

  		// 明星
        let star = {
            name: "张xx",
            age: 25,
            phone: "start: 118999000"
        }

        // 经纪人
        let agent = new Proxy(star, {
            get: function (target, key) {
                if (key === "phone") {
                    return "agent: 123444000"
                }

                if (key === "price") {
                    return "12000"
                }
                return target[key]

            },
            set: function (target, key, val) {
                console.log(target, key, val);
                if (key === "customPrice") {
                    if (val < 12000) {
                        throw new Error("价格太低了")
                    } else {
                        return target[key] = val
                    }
                }
            }
        })
        console.log(agent.phone);
        console.log(agent.price);
        console.log(agent.name);
        console.log(agent.age);
        agent.customPrice = 900000
        console.log('agent.customPrice', agent.customPrice);

经过代理模式之后的 明星的电话和报价都是限制了的