在 ECMAScript 2019 (ES10) 中，引入了一种新的语法——装饰器（Decorator）。装饰器是一种函数，用来修改类的行为。它可以在不修改类的前提下，动态地扩展类的功能。本文将介绍如何使用装饰器来实现代码统计和日志记录。
装饰器的基本语法
装饰器是一个函数，可以接受三个参数：
function decorator(target, key, descriptor) {
// do something
}target：被装饰的目标对象，可以是类的原型对象或类的静态方法。key：被装饰的属性名，可以是类的方法名或类的属性名。descriptor：被装饰的属性描述符，可以获取和修改类的属性特性。
装饰器可以通过 @ 符号来调用：
@decorator
class MyClass {}装饰器的应用
代码统计
我们可以使用装饰器来实现代码统计的功能。例如，我们可以定义一个装饰器，用来统计一个类的方法被调用的次数：
// javascriptcn.com 代码示例
function count(target, key, descriptor) {
let count = 0;
const originalMethod = descriptor.value;
descriptor.value = function(...args) {
count++;
return originalMethod.apply(this, args);
};
target[key] = function() {
return count;
};
return descriptor;
}在上面的代码中，我们定义了一个名为 count 的装饰器，它接受三个参数。在装饰器内部，我们定义了一个变量 count，用来存储方法被调用的次数。然后，我们获取了被装饰的方法的原始函数，并将其重写。在重写的函数中，我们增加了一个计数器，并在原始函数执行后返回结果。最后，我们将计数器赋值给类的属性，并返回属性描述符。
使用装饰器来统计方法的调用次数非常简单。例如，我们可以定义一个类，然后在类的方法上添加 @count 装饰器：
class Calculator {
@count
static add(a, b) {
return a + b;
}
}现在，我们可以调用 Calculator.add(1, 2) 方法来执行加法运算。我们还可以调用 Calculator.add() 方法来获取该方法被调用的次数。
日志记录
我们还可以使用装饰器来实现日志记录的功能。例如，我们可以定义一个装饰器，用来记录一个类的方法被调用的时间和参数：
function log(target, key, descriptor) {
const originalMethod = descriptor.value;
descriptor.value = function(...args) {
console.log(`[${new Date().toLocaleString()}] ${key}(${args.join(', ')})`);
return originalMethod.apply(this, args);
};
return descriptor;
}在上面的代码中，我们定义了一个名为 log 的装饰器，它接受三个参数。在装饰器内部，我们获取了被装饰的方法的原始函数，并将其重写。在重写的函数中，我们使用 console.log 函数来记录方法被调用的时间和参数，并在原始函数执行后返回结果。最后，我们返回属性描述符。
使用装饰器来记录方法的调用时间和参数也非常简单。例如，我们可以定义一个类，然后在类的方法上添加 @log 装饰器：
class Calculator {
@log
static add(a, b) {
return a + b;
}
}现在，我们可以调用 Calculator.add(1, 2) 方法来执行加法运算，并在控制台中查看方法被调用的时间和参数。
总结
在 ECMAScript 2019 (ES10) 中，装饰器是一种很有用的语法，可以用来动态地扩展类的功能。本文介绍了如何使用装饰器来实现代码统计和日志记录的功能，并给出了示例代码。装饰器可以让我们的代码更加简洁、优雅和易于维护。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65054f4695b1f8cacd1cfdf9