ES6 箭头函数(arrow function)

发布时间:2019-08-09 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了ES6 箭头函数(arrow function)脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

例行声明:接下来的文字内容全部来自 Understanding ECMAScript 6,作者是Nicholas C.Zakas,也就是大名鼎鼎的PRofessional JavaScript for Web DeveloPErs(《JavaScript高级程序设计》)的作者。我很喜欢他的写作风格,所以在看了Understanding ECMAScript 6后试着自己写篇博客梳理一下,相当于简单翻译和巩固一下吧。在此特别感谢Nicholas的原创,我只是一个小矮人,站在巨人的肩膀上,所以看到了原本看不到的风景。
原文链接:https://leanpub.com/understan...

@H_777_5@1: 什么是箭头函数
箭头函数,顾名思义就是用箭头(=>来定义的函数,不会用到关键字‘function’),例如:

let sum = (a, b)=> {return a + b;}

效果等同于:

VAR sum = function(a, b){return a + b;} 

但是,事实上上面两个function存在很多不同,会在之后的第三点讲解

2: 箭头函数的多种定义方式
箭头函数的定义形式有很多种(这也是我不喜欢的一点,呵呵),具体的有:

1: 什么情况下都可以型

let sum = (a, b)=>{return a + b;}

这种是最常用,最通用的形式。

2: 只有一个参数型

let self = num1 => {return num1;}

可以看到相对第一种定义的区别是:没有用()包围参数. 这种形式只可以在这种情况下用。

3: 没有参数型

let functionA = ()=> {return 'hehe';}

当没有参数时,必须要有'()'

4: 两个参数及其以上型


let sum = (a, b) => {return a + b;}

当有两个及其以上的参数时,也必须要用‘()’把参数括起来。

5:没有return&&没有{}

let sum = (a, b) => a + b;

你可以同时不给return关键字和{},效果`等同`于上面的第4种情况

6: 没有return && 有{}

let sum = (a, b)=> {a + b;}

这种情况不等于第5种,这种情况下`'a+b'`并不会作为这个函数的返回值,如果你调用这个函数,得到的结果`‘undefined’`

7: 有return && 没有{}

let sum = (a, b)=> return a + b;

不要作死,这种写法直接给你一个syntaxError.

注明,以上的第5,6,7点针对的是函数方法体的部分,不论函数参数是几个,结果没有区别;同样的,第2,3,4点针对的是函数的参数部分,不论函数的方法体怎么写,对结果没有影响。

3: 箭头函数和一般的非箭头函数的区别:

1: 没有this, super, argumentsnew.target绑定。一个箭头函数里面的这几个指由包含它的最近的非箭头函数决定
2: 不能使用new来调用。因为箭头函数没有构造方法。
3: 没有[prototype]属性。因为不能new一个箭头函数,所以prototype也没必要有了。
4: 不能改变this的值。this的值在这个箭头函数的整个生命周期里面都不变。
5: 没有arguments。你必须通过命名参数和剩余参数去获取箭头函数的参数。
6: 不能有重名参数。非箭头函数在非严格模式下面可以有重名参数。

脚本宝典总结

以上是脚本宝典为你收集整理的ES6 箭头函数(arrow function)全部内容,希望文章能够帮你解决ES6 箭头函数(arrow function)所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。