ES6箭头函数和扩展实例分析


Posted in Javascript onMay 23, 2020

本文实例讲述了ES6箭头函数和扩展。分享给大家供大家参考,具体如下:

ES6箭头函数和扩展实例分析

1.默认值

在ES6中给我们增加了默认值的操作相关代码如下:

function add(a,b=1){
  return a+b;
}
console.log(add(1));

可以看到现在只需要传递一个参数也是可以正常运行的。

输出结果为:2。

2.主动抛出错误

ES6中我们直接用throw new Error( xxxx ),就可以抛出错误。

function add(a,b=1){
  if(a == 0){
    throw new Error('This is error')
  }
   return a+b;
}
console.log(add(0));

在控制台可看到异常为:

ES6箭头函数和扩展实例分析

3.函数中的严谨模式

我们在ES5中就经常使用严谨模式来进行编程,但是必须写在代码最上边,相当于全局使用。在ES6中我们可以写在函数体中,相当于针对函数来使用。例如:

function add(a,b=1){
  'use strict'
  if(a == 0){
    throw new Error('This is error');
  }
   return a+b;
}
console.log(add(1));

上边的代码如果运行的话,你会发现浏览器控制台报错,这个错误的原因就是如果你使用了默认值,再使用严谨模式的话,就会有冲突,所以我们要取消默认值的操作,这时候你在运行就正常了。

function add(a,b){
  'use strict'
  if(a == 0){
    throw new Error('This is error');
  }
   return a+b;
}
console.log(add(1,2));

结果为3。

4.获得需要传递的参数个数

 ES6为我们提供了得到参数的方法(xxx.length).我们用上边的代码看一下需要传递的参数个数。

function add(a,b){
  'use strict'
  if(a == 0){
    throw new Error('This is error');
  }
   return a+b;
}
console.log(add.length);//2

这时控制台打印出了2,但是如果我们去掉严谨模式,并给第二个参数加上默认值的话,如下:

function add(a,b=1){

  if(a == 0){
    throw new Error('This is error');
  }
  return a+b;
}
console.log(add.length);//1

这时控制台打印出了1。

总结:它得到的是必须传入的参数。

5.箭头函数

在箭头函数中,方法体内如果是两句话,那就需要在方法体外边加上{}括号

var add =(a,b=1) => {
  console.log('hello world')
  return a+b;
};
console.log(add(1));//2

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
JQuery.ajax传递中文参数的解决方法 推荐
Mar 28 Javascript
B/S模式项目中常用的javascript汇总
Dec 17 Javascript
jQuery取id有.的值的方法
May 21 Javascript
js中setTimeout()与clearTimeout()用法实例浅析
May 12 Javascript
详解JavaScript中的异常处理方法
Jun 16 Javascript
js实现动态加载脚本的方法实例汇总
Nov 02 Javascript
jQuery获取浏览器类型和版本号的方法
Jul 05 Javascript
微信小程序实现倒计时补零功能
Jul 09 Javascript
JS实现选项卡效果的代码实例
May 20 Javascript
ES6中定义类和对象的方法示例
Jul 31 Javascript
ES6基础之 Promise 对象用法实例详解
Aug 22 Javascript
详细分析JavaScript中的深浅拷贝
Sep 17 Javascript
ES6新增的数组知识实例小结
May 23 #Javascript
ES6扩展运算符和rest运算符用法实例分析
May 23 #Javascript
JavaScript组合设计模式--改进引入案例分析
May 23 #Javascript
JavaScript组合模式---引入案例分析
May 23 #Javascript
JavaScript设计模式--桥梁模式引入操作实例分析
May 23 #Javascript
JavaScript设计模式--简单工厂模式实例分析【XHR工厂案例】
May 23 #Javascript
JavaScript设计模式--简单工厂模式定义与应用案例详解
May 23 #Javascript
You might like
php控制linux服务器常用功能 关机 重启 开新站点等
2012/09/05 PHP
谈谈关于php的优点与缺点
2013/04/11 PHP
WordPress中访客登陆实现邮件提醒的PHP脚本实例分享
2015/12/14 PHP
php实现图片按比例截取的方法
2017/02/06 PHP
php常用的工具开发整理
2019/09/26 PHP
javascript中运用闭包和自执行函数解决大量的全局变量问题
2010/12/30 Javascript
js实现图片轮播效果
2015/12/19 Javascript
JS+CSS实现鼠标经过弹出一个DIV框完整实例(带缓冲动画渐变效果)
2016/03/25 Javascript
详解vue-meta如何让你更优雅的管理头部标签
2018/01/18 Javascript
jQuery niceScroll滚动条错位问题的解决方法
2018/02/03 jQuery
一秒学会微信小程序制作table表格
2019/02/14 Javascript
通过实例了解Nodejs模块系统及require机制
2020/07/16 NodeJs
Python的内存泄漏及gc模块的使用分析
2014/07/16 Python
浅谈python为什么不需要三目运算符和switch
2016/06/17 Python
对于Python中RawString的理解介绍
2016/07/07 Python
利用Django内置的认证视图实现用户密码重置功能详解
2017/11/24 Python
numpy中loadtxt 的用法详解
2018/08/03 Python
python将txt文档每行内容循环插入数据库的方法
2018/12/28 Python
Django框架模型简单介绍与使用分析
2019/07/18 Python
python使用socket 先读取长度,在读取报文内容示例
2019/09/26 Python
使用python脚本自动生成K8S-YAML的方法示例
2020/07/12 Python
8种常用的Python工具
2020/08/05 Python
Python用SSH连接到网络设备
2021/02/18 Python
Pytorch - TORCH.NN.INIT 参数初始化的操作
2021/02/27 Python
美国户外生活方式品牌:Eddie Bauer
2016/12/28 全球购物
汽车队司机先进事迹材料
2014/02/01 职场文书
副职竞争上岗演讲稿
2014/05/12 职场文书
2014年教师节活动总结
2014/08/29 职场文书
社区班子个人对照检查材料思想汇报
2014/10/07 职场文书
侵犯商业秘密的律师函
2015/05/27 职场文书
党支部考察意见范文
2015/06/02 职场文书
家庭贫困证明
2015/06/16 职场文书
婚前协议书怎么写,才具有法律效力呢 ?
2019/06/28 职场文书
python中的plt.cm.Paired用法说明
2021/05/31 Python
AJAX实现指定部分页面刷新效果
2021/10/16 Javascript
golang生成并解析JSON
2022/04/14 Golang