Es6新增了一个新的函数定义方法,Arrow Function箭头函数。为什么它要叫箭头函数呢?是因为它定义就是一个箭头,所以叫做箭头函数。
简单的定义一下:
var fn1 = (a, b) => {
return a + b
}

而我们常规的定义:var fn1 = function(a, b) {return a + b}
javascript箭头函数这么看其实感觉区别不是很大,我们可以把换行去掉。

var fn1 = (a, b) => { return a + b }
var fn1 = function(a, b) {return a + b}

这样就明显许多,可以看成使用=>取代了function,但是并不能这么简单的说是谁取代了谁。
箭头函数简化了函数的定义过程,毕竟省掉了function呢。并且其实箭头函数不光有上面这种方法,还有另外一种,更加简单的方法。
var fn1 = (a) => 5
简单来说就是这样,然后我们调用fn1的话,会得到5这个值。
当然,并非所有的箭头函数都可以省略return,只有满足当箭头函数的箭头后面是一个简单操作时,可以直接去掉“{ }”,进而不使用return 也能返回值。
虽然看上去箭头函数就像是匿名函数的一种简写,但实际上,箭头函数和匿名函数还是有着很大的差别的,比如说:箭头函数的内部this是词法作用域,是通过上下文确定的。
箭头函数比函数表达式更加简单便捷,并且箭头函数没有属于自己的this,arguments,super以及new.target,箭头函数更适合于那些本身需要匿名函数的地方,而且还不能当作构造函数。
(param1, param2, …, paramN) => { statements }
(param1, param2, …, paramN) => expression
//相当于:(param1, param2, …, paramN) =>{ return expression; }

当参数只有一个的时候,外面的圆括号是可以省略的,param => {example}如果说是一个没有函数的箭头函数的话,那么外面的圆括号就不能省略了,应该写成:
() => {example}
并且箭头函数的参数和箭头是不能换行的。但是,可以通过在=>之后换行,或者用 ()、{}来实现换行var func = (a, b) =>1;
var func = (a, b) => (
1
);
var func = (a, b) => {
return 1
};
var func = (
a,
b
) => 1;

这样子换行是不会有错误提示的。

箭头函数的规范-->ECMAScript 2015 (6th Edition, ECMA-262)      ECMAScript (ECMA-262)      

更多教程-->箭头函数<

最后修改:2021 年 04 月 20 日 08 : 42 AM
如果觉得我的文章对你有用,请随意赞赏