ts中的装饰器
Posted windcat
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了ts中的装饰器相关的知识，希望对你有一定的参考价值。
// 装饰器一种特殊的类的声明， 扩展类、属性、方法。
function logClass(params:any) {
console.log(params); // params代表HttpClict这个类
params.propotype.apiurl = ‘fadsf‘;
}
// 普通装饰器
@logClass
class HttpClict {
constructor() {
}
getdata() {
}
}
// 装饰器工厂
//类装饰器
function logClass1(params:any) {
return function(target:any) {
console.log(target) //当前类
console.log(params) // 调用装饰器传入实参
}
}
//属性装饰器
function attr(params:any) {
return function(target:any,attr:any){
console.log(params) // 属性url传入的形参
console.log(target) // 当前类
console.log(attr) //当前属性名称
target[attr] = params; // 修改构造函数里面的属性
}
}
// 方法装饰器
/**
* 方法装饰器会在运行时传入三个参数
* 1.对于静态成员来说是类的构造函数，对于实例成员是类的原型对象
* 2.成员的名字
* 3.成员属性的描述符
*/
function logMethod(params:any) {
return function(target:any,methodName:any,desc:any) {
console.log(target)
console.log(methodName)
console.log(desc)
}
}
//方法参数装饰器
/**
* 1.对于静态成员来说是类的构造函数，对于实例成员来说是类的原型对象
* 2.参数 的名字
* 3.参数在函数参数列表中的索引
*/
function logParams(params:string) {
return function(target:any,methodName:any,paramsIndes:any) {
console.log(target)
console.log(methodName)
console.log(paramsIndes)
}
}
@logClass1(‘fsdf‘)
class HttpClict1 {
@attr(‘12‘)
url:string | undefined;
constructor() {
}
@logMethod(‘123‘)
getdata(@logParams(‘12‘) param:any) {
}
}
// 装饰器执行顺序
// 属性装饰器 -> 方法装饰器 -> 类装饰器
// 相同装饰器从后向前执行。
以上是关于ts中的装饰器的主要内容，如果未能解决你的问题，请参考以下文章