用符号(=>)表示的箭头函数可以帮助您创建匿名函数和方法。这将导致更短的语法。例如,下面是一个简单的“Add”函数,它返回两个数字的加法。
function Add(num1 , num2 ){
return num1 + num2;
}
通过使用如下所示的“箭头”语法,上面的函数变得更短。
上述代码有两部分,如上图所示:-
输入:—指定匿名函数的输入参数。
逻辑:-这部分出现在符号“=>”之后。本节符合实际函数的逻辑。
许多开发人员认为箭头函数使您的语法更短,更简单,从而使您的代码可读。
如果你相信上面这句话,那么让我向你保证这是一个神话。如果你想一下,一个正确编写的带有名称的函数比在一行中使用箭头符号创建的神秘函数更具可读性。
箭头函数的主要用途是确保代码运行在
呼叫者上下文。
请参阅下面的代码,其中定义了一个全局变量“context”,该全局变量在函数“SomeOtherMethod”中访问,该函数从其他方法“SomeMethod”中调用。
这个“SomeMethod”具有本地“context”变量。现在因为“SomeOtherMethod”是从“SomeMethod”中调用的,我们期望它显示“本地上下文”,但它显示“全局上下文”。
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中的箭头函数),它解释了JavaScript上下文的所有场景,以及在哪些场景中调用者上下文不受尊重。
你也可以在我制作的youtube视频中看到用javascript演示的箭头函数,它实际上演示了上下文这个术语。