使用箭头函数时，开发工具中未定义“this”答案

【问题标题】：`this` is undefined in Dev Tools when using arrow function使用箭头函数时，开发工具中未定义“this”
【发布时间】：2016-09-08 00:37:00
【问题描述】：

我正在使用箭头函数，并且正在使用 Chrome 和 Firefox 开发工具进行调试。我得到，this 未定义，即使代码仍然有效。

例如：在以下断点处暂停时，我在控制台中输入this，它会输出undefined，即使console.log 显示正确的this：

class A {
    f = () => {
        debugger;
        console.log(this);
    };
}
new A().f();

我的假设是，它与源映射有关。

以下是我用来构建代码的工具：

【问题讨论】：

【解决方案1】：

这可能是个问题，因为 JS 箭头函数没有 this，this 的值可能引用了包含您的箭头函数的对象，每个 Arrow functions revisited 和 MDN's article on Arrow function expressions

【讨论】：

【解决方案2】：

问题是chrome调试器认为源代码中的this指的是运行时this，但是typescript源代码中箭头函数里面的this实际上转化为_this，所以它向你显示了错误的对象。

这就是为什么它只是调试器中的一个问题并且代码仍然可以正常工作。当我需要调试有问题的东西时，我只需将其复制到控制台并在其前面加上下划线即可。

【讨论】：