JavaScript中“ =>”（等于或大于的箭头）的含义是什么？

JavaScript

Davaid飞羽

2020-03-14

我知道>=运算符的含义是大于或等于，但是我已经=>在一些源代码中看到了。该运算符是什么意思？

这是代码：

promiseTargetFile(fpParams, aSkipPrompt, relatedURI).then(aDialogAccepted => {
    if (!aDialogAccepted)
        return;

    saveAsType = fpParams.saveAsType;
    file = fpParams.file;

    continueSave();
}).then(null, Components.utils.reportError);

第1595篇《JavaScript中“ =>”（等于或大于的箭头）的含义是什么？》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

共6个回答

逆天小卤蛋Green 2020.03.14

用符号（=>）表示的箭头函数可帮助您创建匿名函数和方法。这导致语法更短。例如，下面是一个简单的“加”函数，该函数返回两个数字的加法。

function Add(num1 , num2 ){
return num1 + num2;
}

如下所示，通过使用“箭头”语法，上述功能变得更短。

Above code has two parts as shown in the above diagram: -

Input: — This section specifies the input parameters to the anonymous function.

Logic: — This section comes after the symbol “=>”. This section has the logic of the actual function.

Many developers think that arrow function makes your syntax shorter, simpler and thus makes your code readable.

If you believe the above sentence, then let me assure you it’s a myth. If you think for a moment a properly written function with name is much readable than cryptic functions created in one line using an arrow symbol.

The main use of arrow function is to ensure that code runs in the callers context.

请参见下面的代码，其中定义了全局变量“ context”，可以在从其他方法“ SomeMethod”调用的函数“ SomeOtherMethod”中访问此全局变量。

此“ SomeMethod”具有局部“ context”变量。现在，由于从“ SomeMethod”调用了“ SomeOtherMethod”，我们希望它显示“ local context”，但显示“ global context”。

var context = “global context”;

function SomeOtherMethod(){
alert(this.context);
}

function SomeMethod(){
this.context = “local context”;
SomeOtherMethod();
}

var instance = new SomeMethod();

但是，如果使用Arrow函数替换调用，它将显示“本地上下文”。

var context = "global context";

    function SomeMethod(){
        this.context = "local context";
        SomeOtherMethod = () => {
            alert(this.context);
        }
        SomeOtherMethod();
    }
    var instance = new SomeMethod();

我鼓励您阅读此链接（JavaScript中的Arrow函数），该链接解释了javascript上下文的所有情况以及在哪些情况下不尊重调用者上下文。

您还可以在此youtube视频中看到带有JavaScript的Arrow函数演示，该演示实际上演示了上下文。

梅Tony 2020.03.14

正如所有其他答案已经说过的那样，它是ES2015箭头函数语法的一部分。更具体地说，它不是运算符，而是将参数与主体分开的标点符号ArrowFunction : ArrowParameters => ConciseBody。例如(params) => { /* body */ }。

阳光凯 2020.03.14

我读过，这是象征Arrow Functions中ES6

这个

var a2 = a.map(function(s){ return s.length });

使用Arrow Function可以写成

var a3 = a.map( s => s.length );

MDN文件

null 2020.03.14

只是添加另一个lambda在不使用地图的情况下可以做什么的示例：

a = 10
b = 2

var mixed = (a,b) => a * b; 
// OR
var mixed = (a,b) => { (any logic); return a * b };

console.log(mixed(a,b)) 
// 20

Sam神乐番长 2020.03.14

正如其他人所说，创建函数是一种新语法。

但是，这种功能与普通功能不同：

他们约束this价值。如规范所述，

一个ArrowFunction没有定义本地绑定arguments， super，this，或new.target。任何参照arguments， super，this，或new.target的内ArrowFunction必须解析为在词法封闭环境的结合。通常，这将是立即封闭函数的函数环境。

即使ArrowFunction可能包含对它的引用super，也无法通过执行MakeMethod将步骤4中创建的函数对象制成方法。引用的ArrowFunctionsuper 始终包含在非ArrowFunction中，并且super可以通过ArrowFunction的函数对象捕获的范围来访问实现的必要状态。
他们是非构造函数。

这意味着它们没有[[Construct]]内部方法，因此无法实例化，例如
```
var f = a => a;
f(123);  // 123
new f(); // TypeError: f is not a constructor
```