Question

也许很多人会发现这个问题微不足道，但经过3天的搜索没有任何答案我自己找到了答案，也许将来有人会在搜索谷歌时需要这个标题..

我必须明白为什么A有效而B无效？为什么我只能作为代表访问我的this.MarkContents_Input()功能？

一个。

refreshInputStatistics(): void {
        this.updateprocessing();
        setTimeout(() =>
            this.MarkContents_Input(this.vc.returnEditor(staticEditorDirective.textAreaEnum.LeftTextArea))
            ,50);
    }

乙

refreshInputStatistics(): void {
        this.updateprocessing();
        setTimeout(
            this.MarkContents_Input(this.vc.returnEditor(staticEditorDirective.textAreaEnum.LeftTextArea))
            ,50);
    }

我对前端Web开发很新，也许我错过了一些东西（？）

编辑：我的问题被标记为重复，是的我同意，现在我看到它重复，但搜索关键字在这里可以帮助其他人（如上所述，不幸的是3天的搜索确实没有引导我的第一个问题，本可以让我头疼得多...... ）

Answer 1

这是因为this在Javascript中的工作方式以及胖箭头函数() => {}如何绑定this上下文。对于Javascript的新手来说，这可能会非常混乱。这是一种陷阱，但另一方面它使Javascript强大（你可以使用somefunction.call(somethingWhatReplacesThis, whateverArguments)

A选项基本上等同于此类似的东西。我希望它能更清楚。

refreshInputStatistics(): void {
        this.updateprocessing();
        var that = this; // store context for usage in setTimeout
        setTimeout(            that.MarkContents_Input(that.vc.returnEditor(staticEditorDirective.textAreaEnum.LeftTextArea))
            ,50);
    }

更深入的解释

setTimeout（）和其他回调函数在全局上下文中计算，其中this关键字指向全局对象（通常为window，但这取决于执行函数的环境（浏览器，NodeJs，Webworker ......）因此，为了使其工作，您需要将上下文捕获到变量。胖箭头功能会自动为您完成，并转换为类似于上面示例的内容。

有用的链接

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this

How does the "this" keyword work?

从setTimeout（）方法调用函数

1 个答案: