Question

如何获得＆＃34;回到之前的this？为了更好地解释，我创建了这个示例代码：

class MyClass {
    constructor(x,y,z) {
    this.x = x;
    this.y = y;
        setTimeout(function () {
            this.z = z;
        }, 1000);
    }
}

var myVariable = new MyClass(10,15,20);

setTimeout(function () {
    console.log(myVariable.z);
}, 1500);

问题是最后一条车道应输出20，但它会给我一个错误。

我理解为什么。 this.z被this setTimeout()理解为myClass，而myVariable.z被理解为this未定义。

如何在myVariable内设置MyClass的{{1}}？

Answer 1

使用带有this的词汇绑定的ES6箭头功能：

＆＃13;

class MyClass {
    constructor(x,y,z) {
    this.x = x;
    this.y = y;
        setTimeout(() => {
            this.z = z;
        }, 1000);
    }
}

var myVariable = new MyClass(10,15,20);

setTimeout(function () {
    console.log(myVariable.z);
}, 1500);

＆＃13;

在箭头函数中使用this是指周围代码块的this（也称为静态范围）。

另请参阅：Do arrow functions not bind `this` inside ES6 classes?

Answer 2

您的lambda函数（闭包）被异步调用，因此它不会在对象上下文中运行。但是，您可以在上层上下文中保存引用，并在闭包中使用它。

e.g。 var that = this;然后that.z = z;

回到上一个＆＃34;这个＆＃34;

2 个答案: