为什么装饰器必须将（this）应用于函数

Question

我在 javascript 上下文中阅读了很多关于此的内容，并试图理解装饰器代码。每当我查看如下装饰器代码时，它总是将此输入函数应用于“this”，即使输入函数没有对“this”进行任何引用。这是为什么？是否有必要总是在装饰器中将函数应用于“this”？它还在很多地方说装饰器不能是箭头函数，因为绑定到 this。有人可以为什么这会影响功能吗？

function doSomething(name) {
  console.log('Hello, ' + name);
}

function loggingDecorator(wrapped) {
  return function() {
    console.log('Starting');
    const result = wrapped.apply(this, arguments);
    console.log('Finished');
    return result;
  }
}

const wrapped = loggingDecorator(doSomething);

Answer 1

当被包装的函数作为某个对象的方法被调用时，这是为包装函数提供正确的this 所必需的，请考虑：

function loggingDecorator(wrapped) {
    return function () {
        console.log('Starting');

        //const result = wrapped() // <-- this doesn't work
        const result = wrapped.apply(this, arguments); // <-- this does

        console.log('Finished');
        return result;
    }
}

class T {
    constructor() {
        this.property = 42;
    }

    someMethod() {
        console.log(this.property)
    }
}


T.prototype.someMethod = loggingDecorator(T.prototype.someMethod);

t = new T;
t.someMethod();

这里，我们的装饰函数调用this等于t，并且必须将这个this传递给原始方法，否则它将无法解析this.property。显然，如果原始函数不以任何方式使用this，则没有必要这样做，但始终使用apply 编写装饰器是一个好习惯，这样它们就可以在任何上下文中使用。