JavaScript中“ =>”(等于或大于的箭头)的含义是什么?

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

这是代码:

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

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

    continueSave();
}).then(null, Components.utils.reportError);
逆天小卤蛋Green2020/03/14 18:14:15

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

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视频中看到带有JavaScriptArrow函数演示,该演示实际上演示了上下文。

梅Tony2020/03/14 18:14:15

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

阳光凯2020/03/14 18:14:15

我读过,这是象征Arrow FunctionsES6

这个

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

使用Arrow Function可以写成

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

MDN文件

2020/03/14 18:14:15

只是添加另一个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 18:14:15

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

但是,这种功能与普通功能不同:

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

    一个ArrowFunction没有定义本地绑定argumentssuperthis,或new.target任何参照argumentssuperthis,或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
    
猿乐2020/03/14 18:14:15

这将是ECMAScript 6中引入的“箭头函数表达式”。

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/arrow_functions

出于历史目的(如果Wiki页面稍后更改),它是:

箭头函数表达式的语法比函数表达式短,并且在词法上绑定了此值。箭头功能始终是匿名的。