类的修饰器

是什么

修饰器是一个对类进行处理的函数。修饰器不仅可以修饰类,还可以修饰类的属性,但是修饰器不能用于函数。

怎么用

  • 修饰类
    当修饰类时:修饰器函数的第一个参数,就是所要修饰的目标类。
      function action(target) {
        target.prototype.eat = function () { //eat 会作为类的实例的属性
          console.log('person can eat food')
        }
        target.sleep = function () { //sleep会作为类的静态属性,用类名直接调用。
          console.log('person can sleep')
        }
    
      }
    
      @action //action 为修饰器
      class Person {
        constructor(fullname, age) {
          this.fullname = fullname;
          this.age = age;
        }
        toString() {
          console.log(this.fullname + '---' + this.age);
        }
      }
    
      var p1 = new Person('xxx', 25);
      p1.toString(); //xxx---25 
      p1.eat() //person can eat food
      Person.sleep() //person can sleep
    
  • 修饰类的属性
    当修饰类的属性时:修饰器函数的第一个参数,是所要修饰的目标类的原型对象,第二个参数是所要修饰的属性名,第三个参数是该属性的描述对象。
      function readOnly(target, sex, descriptor) {
        descriptor.writable = false;
        return descriptor
      }
    
      class Person {
        constructor(fullname, age) {
          this.fullname = fullname;
          this.age = age;
        }
        toString() {
          console.log(this.fullname + '---' + this.age);
        }
        @readOnly
        sex = 'men'
      }
      var p1 = new Person('xxx', 25);
      p1.toString(); //xxx---25
      console.log(p1.sex)   //men
      p1.sex = 'women'
      console.log(p1.sex)  //men
      //我们用readOnly来修饰sex属性,从而实现sex不可写,只读。
    
  • 修饰器可以叠加使用,像剥洋葱一样,先从外到内进入,然后由内向外执行。(类似于栈,先进后出)

参考

  • es6阮一峰

你可能感兴趣的:(类的修饰器)