【javaScript】装饰器常用方法

装饰器常用方法

相关文章

装饰器常用方法

一、类装饰器（Class Decorator）

类装饰器用于修饰类，可以在类的声明前面使用 @ 符号来应用。类装饰器接受一个参数，即目标类的构造函数，可以用来扩展或修改类的行为。

function logClass(target) {
    target.prototype.logger = function () {
        console.log("Logging...");
    }
}

@logClass
class MyClass {
    // Class Body
}

const obj = new MyClass();
obj.logger(); // 输出: Logging...

二、方法装饰器（Method Decorator）

方法装饰器用于修饰类的方法，可以在方法的声明前面使用 @ 符号来应用。方法装饰器接受三个参数：目标类的原型对象、属性名、属性描述符，可以用来扩展或修改方法的行为。

function logMethod(target, key, descriptor) {
    const originalMethod = descriptor.value;
    descriptor.value = function (...args) {
        console.log(`Calling method ${key} with arguments: ${args}`);
        return originalMethod.apply(this, args);
    };
    return descriptor;
}

class MyClass {
    @logMethod
    greet(name) {
        return `Hello, ${name}!`;
    }
}

const obj = new MyClass();
console.log(obj.greet("Alice")); 
// 输出: Calling method greet with arguments: Alice
//       Hello, Alice!

三、属性装饰器（Property Decorator）

属性装饰器用于修饰类的属性，可以在属性的声明前面使用 @ 符号来应用。属性装饰器接受两个参数：目标类的原型对象和属性名，可以用来扩展或修改属性的行为。

function readonly(target, key) {
    Object.defineProperty(target, key, {
        writable: false
    });
}

class MyClass {
    @readonly
    PI = 3.14159;
}

const obj = new MyClass();
obj.PI = 3.14; // 会抛出错误，因为属性被设置为只读

四、参数装饰器（Parameter Decorator）

参数装饰器用于修饰类的参数，在参数声明前面使用 @ 符号来应用。参数装饰器接受三个参数：目标类的原型对象、方法名（或构造函数名）、参数在函数参数列表中的索引，可以用来扩展或修改参数的行为。

function logParameter(target, key, index) {
    console.log(`Parameter ${index} of method ${key} has been decorated`);
}

class MyClass {
    greet(@logParameter name) {
        console.log(`Hello, ${name}!`);
    }
}

const obj = new MyClass();
obj.greet("Alice"); 
// 输出: Parameter 0 of method greet has been decorated
//       Hello, Alice!

五、装饰器组合

装饰器可以组合使用，多个装饰器按照从上到下的顺序依次执行。示例：

function decorator1(target: any, propertyKey: string) {
    // 装饰器1逻辑
}

function decorator2(target: any, propertyKey: string) {
    // 装饰器2逻辑
}

class MyClass {
    @decorator1
    @decorator2
    myMethod() {
        // 方法逻辑
    }
}

在这个示例中，myMethod 方法同时应用了两个装饰器 decorator1 和 decorator2，它们将按照从上到下的顺序依次执行。

四、六置装饰器

TypeScript 提供了一些内置的装饰器，用于对类、方法等进行装饰。常见的内置装饰器包括 @deprecated、@experimental、@sealed 等，它们用于标记类、方法等的状态或用途。

@deprecated: 标记为过时

@deprecated 装饰器用于标记某个类、方法或属性已经被废弃，不推荐再使用。当我们在代码中使用了被 @deprecated 标记的成员时，编译器会发出警告，提醒开发者不要使用该成员。
@experimental: 标记为实验性的

@experimental 装饰器用于标记某个类、方法或属性是实验性的，可能在未来版本中发生变化。当我们在代码中使用了被 @experimental 标记的成员时，开发者应该注意这是一个实验性的特性，可能会有不稳定或不完善的地方。
@sealed: 标记为密封的

@sealed 装饰器用于标记某个类是密封的，即不能被继承。当我们在代码中使用了被 @sealed 标记的类时，编译器会阻止该类被其他类继承。