js 对比 vue 装饰者模式

// 装饰者模式的特点(不改变源码方法,重写源码或新写方法里调用源码方法)
如:
源码:
function a(){
    console.log(1);
}
// 新的需求 打印1的同时 还能打印2, 现有源码方法不能满足现在需求
解决方法:

    //新建方法b,c
    function b(){
        console.log(2);
    }
    function c(){
        a();
        b();
    }
    c();


//vue源码中使用:defineProperty(定义数据双向数据绑定(set, get)) 采用装饰者模式
    var arr = ['push', 'pop'];
    arr.forEach( (method) => {
        var ob = Array.prototype; // 在原型链上找到
        var ob1 = Object.assign(ob);// es6新属性拷贝一份
        var before = ob[method];
        ob1[mothod]=function(){
            before.apply(this, argumnets); //apply() 接受数组形式的参数
            dep.notify(); // vue源码中更新时调用的方法
        }    
    })

 

©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页