es6 语法 （Decorator）

Posted 2020-10-12 小角色Byme

修饰器是一个函数，用来修改类的行为（注意：1、函数  2、修改行为  3、对类进行操作）

{
    //修饰器函数定义 target:类本身，name名称，descriptor描述
    let readonly = function(target, name, descriptor) {
        descriptor.writable = false; //只读
        return descriptor
    };
    //类中
    class Test {
        @readonly //调用修饰器
        time() {
            return ‘2017-03-11‘
        }
    }

    let test = new Test();

    // test.time=function(){
    //   console.log(‘reset time‘);
    // }; //不允许只读属性的方法重新赋值


    console.log(test.time()); //2017-03-11
}


{
    let typename = function(target, name, descriptor) {
            target.myname = ‘hello‘;
        }
        //对类进行修饰
    @typename
    class Test {

    }

    console.log(‘类修饰符‘, Test.myname); //hello
    // 第三方库修饰器的js库：core-decorators; npm install core-decorators
}

{
  let log = (type) =>{
    return function(target,name,descriptor){
      let src_method = descriptor.value;
      descriptor.value = (...arg)=>{
        src_method.apply(target,arg);
        console.info(`log ${type}`);
      }
    }
  }
  class AD{
    @log(‘show‘) //log show
    
    show(){
      console.log(‘ad is show‘) //ad is show
    }
    @log(‘click‘) //log click
    click(){
      console.log(‘ad is click‘) //ad is click
    }
  }
  let ad = new AD();
  ad.show();
  ad.click();
}