zoukankan      html  css  js  c++  java
  • JS 装饰器(Decorator)

     

    Decorator 是 ES7 的一个新语法,目前仍处于第2阶段提案中,正如其“装饰器”的叫法所表达的,他通过添加@方法名可以对一些对象进行装饰包装然后返回一个被包装过的对象,可以装饰的对象包括:类,属性,方法等。

    在使用它之前需要引入babel模块 transform-decorators-legacy 编译成 ES5 或 ES6。

    1. 类的装饰

    当装饰的对象是类时,我们操作的就是这个类本身,即装饰器函数的第一个参数,就是所要装饰的目标类。

    @decorator
    class A {}
    
    // 等同于
    class A {}
    A = decorator(A) || A;

    示例:添加一个日志装饰器

    @log
    class MyClass { }
    
    function log(target) { // 这个 target 在这里就是 MyClass 这个类
       target.prototype.logger = () => `${target.name} 被调用`
    }
    
    const test = new MyClass()
    test.logger() // MyClass 被调用

    由于装饰器是表达式,我们也可以在装饰器后面再添加个参数:

    @log('hi')
    class MyClass { }
    
    function log(text) {
      return function(target) {
        target.prototype.logger = () => `${text},${target.name} 被调用`
      }
    }
    
    const test = new MyClass()
    test.logger() // hello,MyClass 被调用

    2. 属性或方法的装饰

    对于类属性或方法的装饰本质是操作其描述符,可以把此时的装饰器理解成是 Object.defineProperty(obj, prop, descriptor)的语法糖。

    class C {
      @readonly(false)
      method() { console.log('cat') }
    }
    
    function readonly(value) {
      return function (target, key, descriptor) { 
        /**
        * 此处 target 为 C.prototype; 
        * key 为 method;
        * 原 descriptor 为:{ value: f, enumarable: false, writable: true, configurable: true }
        */
        descriptor.writable = value
        return descriptor
      }
    }
    
    const c = new C()
    c.method = () => console.log('dog')
    
    c.method() // cat
  • 相关阅读:
    MYbatis调试日记(三)
    Mybatis错误调试(二)
    【转载】MyBatis之传入参数
    Mybatis代码调试问题总结(一)
    【转载】Mybatis多参数查询映射
    未整理的资源
    Strace--系统调用分析问题集锦
    java初始化过程中成员变量
    java三元表达式编程规范问题
    转:Java的一道面试题----静态变量初始化过程
  • 原文地址:https://www.cnblogs.com/tommymarc/p/14956000.html
Copyright © 2011-2022 走看看