TypeScript里的装饰器

如果想让Angular2支持实验性的装饰器特性,需要在tsconfig.json文件里启用experimentalDecorators编译器选项。

{
 "compilerOptions": {
     "target": "ES5",
     "experimentalDecorators": true
   }
}

装饰器

语法: @expressionexpression求值后必须为一个函数,它会在运行时被调用,被装饰的声明信息做为参数传入。

定义@test装饰器:

function test(target) {
       // do something with "target" ...
      // target就是所要修饰的目标类
}

类装饰器

类装饰器在类声明之前被声明,类装饰器应用于类构造函数,可以用来监视,修改或替换类定义。

类装饰器表达式会在运行时当作函数被调用,类的构造函数作为其唯一的参数。

如果类装饰器返回一个值,它会使用提供的构造函数来替换类的声明。

首先定义一个装饰器:

function name(target) {
      target.name = '小m'
}

在类中使用:

@name
class MyNameClass{}
console.log(MyNameClass.name)    //小m

装饰器工厂

装饰器工厂就是一个简单的函数,它返回一个表达式,以供装饰器在运行时调用。

使用方法:

function isName(name) {
    return function(target) {
        target.name = name
    }
}

@isName('小m')
class MyNameClass{}
MyNameClass.name        // 小m
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,993评论 19 139
  • 前言 人生苦多,快来 Kotlin ,快速学习Kotlin! 什么是Kotlin? Kotlin 是种静态类型编程...
    任半生嚣狂阅读 26,282评论 9 118
  • 概述 TypeScript本质上是向JavaScript语言添加了可选的静态类型和基于类的面向对象编程,同时也支持...
    oWSQo阅读 8,558评论 1 45
  • { "Unterminated string literal.": "未终止的字符串文本。", "Identifi...
    一粒沙随风飘摇阅读 10,786评论 0 3
  • 《小王子》里没有生僻的字,没有晦涩的情节,简简单单、真真切切的童真就足够感人肺腑。《小王子》一共27章,宗宗从今天...
    Zack要多喝热水阅读 6,355评论 0 8