/*
装饰器 简单理解为C#中的Attribute
可以装饰到类、函数、讯问符、属性、参数上 语法 @xxx
装饰器其实是一个函数 @xxx 就要有一个 function xxx
多个装饰器可以用来装饰一个声明, @f @g arg
或者在多行上
@f
@g
x
这样的组合最后的结果将会是 f(g(x))
装饰器的执行顺序
1、参数装饰器,然后依次是方法装饰器,访问器装饰器,或属性装饰器应用到每个实例成员。
2、参数装饰器,然后依次是方法装饰器,访问器装饰器,或属性装饰器应用到每个静态成员。
3、参数装饰器应用到构造函数。
4、类装饰器应用到类。 装饰器目前是实验性的功能,可能在以后的某个版本就会移除.默认也是不开启装饰器功能的
我们手动的到tsconfig中配置experimentalDecorators为true
*/ /**
* 一个简单的方法装饰器 参数
target 对于静态成员来说是类的构造函数,对于实例成员是类的原型对象
propertyKey 成员的名字 这里是method
descriptor 成员的属性描述符
如果方法装饰器返回一个值 ,它会被用作方法的塑形描述符
*/
function f() { //当调用C类method方法时其执行顺序是
console.log("f(): evaluated"); //-- 1
return function (target, propertyKey: string, descriptor: PropertyDescriptor) {
console.log("f(): called"); //--4
}
} function g() {
console.log("g(): evaluated"); //--2
return function (target, propertyKey: string, descriptor: PropertyDescriptor) {
console.log("g(): called"); //--3
}
} class C {
@f()
@g()
method() { } // --5
} /*
类装饰器 参数
constructor 构造函数
类装饰器在类声明之前被声明,如果返回一个值(新的构造函数) ,它会使用提供的构造函数来
替换类的声明
*/
function classDecorator(constructor: Function) { } @classDecorator
class B {
constructor(message: string) { }
} /*
访问器装饰器
用来装饰Get; Set 需要注意的是装饰第一个访问器就可以了,它默认装饰Get Set
target 对于静态成员来说是类的构造函数,对于实例成员是类的原型对象
propertyKey 成员的名字 这里是method
descriptor 成员的属性描述符
如果访问器装饰器返回一个值,它会被用作方法的属性描述符。
*/
function Decorator(target: any, propertyKey: string, descriptor: PropertyDescriptor) {
}
class D {
private _x: number; @Decorator
get x() { return this._x }; set x(value: number) { this._x = value };
} /*
属性装饰器 参数
target 对于静态成员来说是类的构造函数,对于实例成员是类的原型对象。
propertyKey 成员的名字。
如果访问符装饰器返回一个值,它会被用作方法的属性描述符。
*/ /*
参数装饰器
target 对于静态成员来说是类的构造函数,对于实例成员是类的原型对象。
propertyKey 成员的名字。
parameterIndex 参数在函数参数列表中的索引。 参数装饰器只能用来监视一个方法的参数是否被传入,并不能拿到值,数装饰器的返回值会被忽略。
*/
function argDecorator(target: Object, propertykey: string | symbol, parameterIndex: number) { }
function fun( @argDecorator name: string) { }

TypeScript 素描 - 装饰器的更多相关文章

  1. TypeScript 中装饰器的理解?应用场景?

    一.是什么 装饰器是一种特殊类型的声明,它能够被附加到类声明,方法, 访问符,属性或参数上 是一种在不改变原类和使用继承的情况下,动态地扩展对象功能 同样的,本质也不是什么高大上的结构,就是一个普通的 ...

  2. typescript - 9.装饰器

    装饰器:装饰器是一种特殊类型的声明,它能够被附加到类声明,方法,属性或参数上,可以修改类的行为. 通俗的讲装饰器就是一个方法,可以注入到类.方法.属性参数上来扩展类.属性.方法.参数的功能. 常见的装 ...

  3. 从C#到TypeScript - 装饰器

    总目录 从C#到TypeScript - 类型 从C#到TypeScript - 高级类型 从C#到TypeScript - 变量 从C#到TypeScript - 接口 从C#到TypeScript ...

  4. TypeScript装饰器(decorators)

    装饰器是一种特殊类型的声明,它能够被附加到类声明,方法, 访问符,属性或参数上,可以修改类的行为. 装饰器使用 @expression这种形式,expression求值后必须为一个函数,它会在运行时被 ...

  5. Angular 个人深究(一)【Angular中的Typescript 装饰器】

    Angular 个人深究[Angular中的Typescript 装饰器] 最近进入一个新的前端项目,为了能够更好地了解Angular框架,想到要研究底层代码. 注:本人前端小白一枚,文章旨在记录自己 ...

  6. 转发: Angular装饰器

    Angular中的装饰器是一个函数,它将元数据添加到类.类成员(属性.方法)和函数参数. 用法:要想应用装饰器,把它放在被装饰对象的上面或左边. Angular使用自己的一套装饰器来实现应用程序各部件 ...

  7. JS中bind、call和apply的作用以及在TS装饰器中的用法

    目录 1,前言 1,call 1.1,例子 1.2,直接调用 1.3,将this指向另一个对象 1.4,传递参数 2,apply 2.1,例子 2.2,直接调用 2.3,将this指向另一个对象 2. ...

  8. 基于TypeScript装饰器定义Express RESTful 服务

    前言 本文主要讲解如何使用TypeScript装饰器定义Express路由.文中出现的代码经过简化不能直接运行,完整代码的请戳:https://github.com/WinfredWang/expre ...

  9. Typescript中的装饰器原理

    Typescript中的装饰器原理 1.小原理 因为react中的高阶组件本质上是个高阶函数的调用, 所以高阶组件的使用,我们既可以使用函数式方法调用,也可以使用装饰器. 也就是说,装饰器的本质就是一 ...

随机推荐

  1. MediaPlayer 音频播放 示例

    状态机.流程图.生命周期 对播放音频/视频文件和流的控制是通过一个状态机来管理的.下图显示一个MediaPlayer对象被支持的播放控制操作驱动的生命周期和状态. 椭圆代表MediaPlayer对象可 ...

  2. java04 Sacnner的使用

    import java.util.Scanner; /** * 所有在java.lang包下面的所有类 不需要显示的引入包! * java.util.Scanner : 想获取用户的输入 必须引入相关 ...

  3. NuGet学习笔记(1)——初识NuGet及快速安装使用(转)

    关于NuGet园子里已经有不少介绍及使用经验,本文仅作为自己研究学习NuGet一个记录. 初次认识NuGet是在去年把项目升级为MVC3的时候,当时看到工具菜单多一项Library Package M ...

  4. GUID的广泛使用

    GUID(Global unique identifier)全局唯一标识符,它是由网卡上的标识数字(每个网卡都有唯一的标识号)以及 CPU 时钟的唯一数字生成的的一个 16 字节的二进制值. GUID ...

  5. Windows 设置时间同步

    1.Windows  Server 2008 r2 注:{}内是你要同步的外部服务器地址,例如复旦的时间同步服务器地址为:ntp.fudan.edu.cn,则完整命令如下: w32tm /config ...

  6. 重新认识Swift中的可选型(Swift2.1)

    //: Playground - noun: a place where people can play import UIKit /* Swift中nil代表是是另外一种类型, 而不像OC那样, 任 ...

  7. [转]Windows环境下利用“共享内存”实现进程间通信的C/C++代码---利用CreateFileMapping和MapViewOfFile

    http://blog.csdn.net/stpeace/article/details/39534361 进程间的通信方式有很多种, 上次我们说了最傻瓜的“共享外存/文件”的方法. 那么, 在本文中 ...

  8. startActivityForResult

    Activity提供了startActivityForResult(Intent intent, int requestCode)方法打开新的Activity,新的Activity关闭后会向前面的Ac ...

  9. 关于js闭包杂记

    闭包:一个函数oneF里return了另一个函数innerF,然后在oneF外面运行了函数innerF,如果innerF里有用到在oneF里定义的变量,则此时依然可以引用到, 但是变量值不是定义函数i ...

  10. Extjs中grid表头内容居中

    在每一列中加上header属性即可,源码: header:'<div style=" text-align: center; vertical-align: middle;" ...