- 时间:2022-12-04 15:03 编辑: 来源: 阅读:
- 扫一扫,手机访问
摘要:深入浅出ES6新特性之函数默认参数和箭头函数
[b]1、函数参数的默认值
[/b]
ES5中不能直接为函数的参数指定默认值,只能通过以下的变通方式:
[img]http://files.jb51.net/file_images/article/201608/20168195419889.png?2016719552[/img]
从上面的代码可以看出存在一个问题,当传入的参数为0或者false时,会直接取到后面的值,而不是传入的这个参数值。
那怎么解决呢?对于上图的代码,可以通过判断是否传入了num参数,没有就用默认值:
[img]http://files.jb51.net/file_images/article/201608/20168195630337.png?20167195642[/img]
这种做法还是很麻烦的,而ES6则直接在参数定义里面设置函数参数的默认值,而且不用担心传入参数是0或者false会出错了:
[img]http://files.jb51.net/file_images/article/201608/20168195707933.png?20167195720[/img]
[b]2、箭头函数[/b]
箭头函数用 => 符号来定义。
箭头函数相当于匿名函数,所以采用函数表达式的写法。
左边是传入函数的参数,右边是函数中执行的语句。
[img]http://files.jb51.net/file_images/article/201608/20168195751695.png?2016719583[/img]
上面是完整的写法,左边小括号,右边大括号,而下面的情况可以简写:
(1)当要执行的代码块只有一条return语句时,可省略大括号和return关键字:
[img]http://files.jb51.net/file_images/article/201608/20168195840817.png?20167195851[/img]
箭头函数在回调函数中是很简洁的,像这样:
[img]http://files.jb51.net/file_images/article/201608/20168195946048.png?2016711001[/img]
需要注意的是, 箭头函数没有自己的this、arguments、super、new.target,它们分别指向外层函数的相应变量。
以前在ES5中使用this有点麻烦,这种问题很常见:
[img]http://files.jb51.net/file_images/article/201608/201681100033529.png?20167110047[/img]
但是现在有了箭头函数,不再需要使用that = this或 _this = this 这种代码啦,因为箭头函数中的this直接就是外层函数中的this,代码更简单了:
[img]http://files.jb51.net/file_images/article/201608/201681100116589.png?20167110129[/img]
以上所述是小编给大家介绍的A深入浅出ES6新特性之函数默认参数和箭头函数,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对编程素材网网站的支持!