箭头功能与胖箭头功能

Question

我在互联网上找到了两个名称，箭头功能和胖箭头功能，但没有关于它们之间有什么不同的信息。

有什么不同吗？

Answer 1

这样的问题需要一些解释......

ECMAScript 5

在ES5规范中，根本没有箭头功能。然后通常使用传统的函数表达式，如：

// Example n°1
var myFunction = function () {
  return 'Hello!';
};

// Example n°2
var obj = {
  myFunction: function () {
    return 'Hello!';
  }
};

// Example n°3
var arr = ['foo', 'bar'];
arr.map(function (item) {
  return 'Hello, ' + item + '!';
};

的CoffeeScript

当Jeremy Ashkenas介绍CoffeeScript时，它带来了一个新的术语，特别是细箭头函数（->）和胖箭头函数（{{1 }}）。

一方面，细箭头函数是与ES5（匿名）函数表达式等效的CoffeeScript。在CoffeeScript中，我们可以编写前面的示例：

=>

另一方面，胖箭头函数是一个很好的实用工具，由CoffeeScript提供，在ES5中没有相同的语法。它的目的是更容易使用词法范围，特别是当你想在回调中保持外部 this 时。让我们以CoffeeScript和传奇的jQuery回调为例。假设我们处于全球范围：

# Example n°1
myFunction = -> 'Hello!'

# Example n°2
obj =
  myFunction: -> 'Hello!'

# Example n°3
arr = ['foo', 'bar']
arr.map((item) -> "Hello, #{item}!")

如果我们想操纵外部＆＃34;这个＆＃34;在回调中，这是ES5代码：

// Here "this" is "window"
console.log(this);

$(document).ready(function () {
  // Here "this" is "document"
  console.log(this);
});

使用CoffeeScript，可以使用胖箭头功能：

var that = this;

$(document).ready(function () {
  console.log(that);
});

当然，它不适用于细箭头功能：

// "this" is "window"!
$(document).ready => console.log this

ECMAScript 6（2015）

ES2015规范引入了箭头功能。它们是CoffeeScript中胖箭头函数的替代品。但由于ES6中没有细箭头函数，因此在不使用CoffeeScript时没有理由讨论胖箭头函数。在ES6中，您可以这样做：

// "this" is "document"
$(document).ready -> console.log this

现在，如果您想保留词法作用域的正常行为，只需使用ES5语法：

// Here "this" is "window"
$(document).ready(() => console.log(this));

Answer 2

  

有什么不同吗？

否

除了“胖箭头功能”一词已被弃用且过时。

这个答案不适用于CoffeeScript，以防任何人仍然使用它。

Answer 3

在CoffeeScript中，胖箭头函数传入封装范围，而普通箭头不是。

Answer 4

来自Tag wiki :(自修订后）

  

CoffeeScript中的函数语法和使用EcmaScript6的JavaScript中的新函数语法，它在语法上类似于其他语言的lambda函数，但不仅仅是语法糖。 CoffeeScript有两个“ - ＆gt;”和“=＆gt;” ，而JavaScript只有后者，也称为“胖箭头功能”。

因此，当参考JS使用时，它们是相同的。