深入浅出ES6新特性之函数默认参数和箭头函数


Posted in Javascript onAugust 01, 2016

1、函数参数的默认值

ES5中不能直接为函数的参数指定默认值,只能通过以下的变通方式:

深入浅出ES6新特性之函数默认参数和箭头函数

从上面的代码可以看出存在一个问题,当传入的参数为0或者false时,会直接取到后面的值,而不是传入的这个参数值。

那怎么解决呢?对于上图的代码,可以通过判断是否传入了num参数,没有就用默认值:

深入浅出ES6新特性之函数默认参数和箭头函数

这种做法还是很麻烦的,而ES6则直接在参数定义里面设置函数参数的默认值,而且不用担心传入参数是0或者false会出错了:

深入浅出ES6新特性之函数默认参数和箭头函数

2、箭头函数

箭头函数用 => 符号来定义。

箭头函数相当于匿名函数,所以采用函数表达式的写法。

左边是传入函数的参数,右边是函数中执行的语句。

深入浅出ES6新特性之函数默认参数和箭头函数

上面是完整的写法,左边小括号,右边大括号,而下面的情况可以简写:

(1)当要执行的代码块只有一条return语句时,可省略大括号和return关键字:

深入浅出ES6新特性之函数默认参数和箭头函数

箭头函数在回调函数中是很简洁的,像这样:

深入浅出ES6新特性之函数默认参数和箭头函数

需要注意的是, 箭头函数没有自己的this、arguments、super、new.target,它们分别指向外层函数的相应变量。

以前在ES5中使用this有点麻烦,这种问题很常见:

深入浅出ES6新特性之函数默认参数和箭头函数

但是现在有了箭头函数,不再需要使用that = this或 _this = this 这种代码啦,因为箭头函数中的this直接就是外层函数中的this,代码更简单了:

深入浅出ES6新特性之函数默认参数和箭头函数

以上所述是小编给大家介绍的A深入浅出ES6新特性之函数默认参数和箭头函数,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JQuery鼠标移到小图显示大图效果的方法
Jun 10 Javascript
JS+CSS相对定位实现的下拉菜单
Oct 06 Javascript
AngularJS使用angular-formly进行表单验证
Dec 27 Javascript
js实现的鼠标滚轮滚动切换页面效果(类似360默认页面滚动切换效果)
Jan 27 Javascript
js添加事件的通用方法推荐
May 15 Javascript
利用JS实现数字增长
Jul 28 Javascript
js字符串引用的两种方式(必看)
Sep 18 Javascript
JS简单实现点击跳转登陆邮箱功能的方法
Oct 31 Javascript
利用Console来Debug的10个高级技巧汇总
Mar 26 Javascript
JQuery通过后台获取数据遍历到前台的方法
Aug 13 jQuery
微信小程序常用简易小函数总结
Feb 01 Javascript
ElementUI Tag组件实现多标签生成的方法示例
Jul 08 Javascript
AngularJS基础 ng-class-odd 指令示例
Aug 01 #Javascript
js添加千分位的实现代码(超简单)
Aug 01 #Javascript
AngularJs定制样式插入到ueditor中的问题小结
Aug 01 #Javascript
jQuery的ajax和遍历数组json实例代码
Aug 01 #Javascript
JS遍历页面所有对象属性及实现方法
Aug 01 #Javascript
AngularJS 基础ng-class-even指令用法
Aug 01 #Javascript
jQuery EasyUI API 中文帮助文档和扩展实例
Aug 01 #Javascript
You might like
PHP中函数rand和mt_rand的区别比较
2012/12/26 PHP
PHP实现基于面向对象的mysqli扩展库增删改查操作工具类
2017/07/18 PHP
javascript 图片裁剪技巧解读
2012/11/15 Javascript
Js获取数组最大和最小值示例代码
2013/10/29 Javascript
jquery禁止输入数字以外的字符的示例(纯数字验证码)
2014/04/10 Javascript
js 获取input点选按钮的值的方法
2014/04/14 Javascript
jQuery如何将选中的对象转化为原始的DOM对象
2014/06/09 Javascript
jQuery中$.each使用详解
2015/01/29 Javascript
js实现绿白相间竖向网页百叶窗动画切换效果
2015/03/02 Javascript
学习javascript面向对象 理解javascript对象
2016/01/04 Javascript
动态生成的DOM不会触发onclick事件的原因及解决方法
2016/08/06 Javascript
JS实现自定义状态栏动画文字效果示例
2017/10/12 Javascript
用vue封装插件并发布到npm的方法步骤
2017/10/18 Javascript
Vue中computed与methods的区别详解
2018/03/24 Javascript
vue项目部署上线遇到的问题及解决方法
2018/06/10 Javascript
JavaScript的词法结构精华篇
2018/10/17 Javascript
Vue中使用canvas方法总结
2019/02/12 Javascript
解决微信浏览器缓存站点入口文件(IIS部署Vue项目)
2019/06/17 Javascript
js设置鼠标悬停改变背景色实现详解
2019/06/26 Javascript
layui 数据表格复选框实现单选功能的例子
2019/09/19 Javascript
npm qs模块使用详解
2020/02/07 Javascript
[01:32:50]DOTA2-DPC中国联赛 正赛 DLG vs XG BO3 第一场 1月25日
2021/03/11 DOTA
[55:26]DOTA2-DPC中国联赛 正赛 Aster vs LBZS BO3 第一场 2月23日
2021/03/11 DOTA
用Python编写简单的微博爬虫
2016/03/04 Python
关于python的list相关知识(推荐)
2017/08/30 Python
python数字图像处理之骨架提取与分水岭算法
2018/04/27 Python
python tools实现视频的每一帧提取并保存
2020/03/20 Python
html5教程调用绘图api画简单的圆形代码分享
2013/12/04 HTML / CSS
深入了解canvas在移动端绘制模糊的问题解决
2019/04/30 HTML / CSS
英国最大的笔记本电脑直销专家:Laptops Direct
2019/07/20 全球购物
英国豪华家具和家居用品购物网站:Teddy Beau
2020/10/12 全球购物
遇到的Mysql的面试题
2014/06/29 面试题
给老婆大人的检讨书
2014/02/24 职场文书
2016年过年放假安排通知
2015/08/18 职场文书
党务工作者主要事迹材料
2015/11/03 职场文书
创业计划书之韩国烧烤店
2019/09/19 职场文书