为什么 Babel 在原型函数中将“this”关键字编译为未定义？ [复制]答案

【问题标题】：Why Babel compile 'this' keyword as undefined inside a prototype function? [duplicate]为什么 Babel 在原型函数中将“this”关键字编译为未定义？ [复制]
【发布时间】：2018-01-04 00:09:52
【问题描述】：

我刚开始学习ES6，所以我使用Babel 编译该代码，但是当我将this 关键字分配给原型方法中的变量时，它编译为undefined

这是一个错误吗？还是我的代码有问题？

ES6 代码

function Prefixer(prefix) {
    this.prefix = prefix;
}

Prefixer.prototype.prefixArray = arr => {
    let self = this;
    return arr.map((x) => {
        console.log(self.prefix + x);
    });
}

var pre = new Prefixer("Hello ");
pre.prefixArray(['Jeeva', 'Kumar']);

Babel 编译代码

'use strict';

function Prefixer(prefix) {
    this.prefix = prefix;
}

Prefixer.prototype.prefixArray = function (arr) {
    var self = undefined;
    return arr.map(function (x) {
        console.log(self.prefix + x);
    });
};

var pre = new Prefixer("Hello ");
pre.prefixArray(['Jeeva', 'Kumar']);

【问题讨论】：

您好，欢迎来到 Stack Overflow。请注意，我们非常不喜欢图像中的代码，并且更喜欢我们可以实际复制和粘贴甚至执行的代码。用四个空格缩进代码以显示为代码。您可以通过直观地选择您的代码，然后点击 Ctrl-K（或 Mac 上的 Cmd-K）来自动完成。
因为您使用的是箭头函数，所以 this 是从定义范围继承的。您应该不在原型方法中使用箭头函数
哦，好吧，所以箭头函数有一个限制

标签： javascript ecmascript-6 this babeljs

【解决方案1】：

看到这个：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

简而言之，在箭头函数中，this 没有绑定。

【讨论】：

谢谢，我不知道是箭头函数引起的，我以为箭头函数只是一个普通的函数，可以少写代码，但现在我明白了，它与正常功能