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实现图片左右自动滚动示例
Sep 25 Javascript
js获取触发事件元素在整个网页中的绝对坐标(示例代码)
Dec 13 Javascript
浅析js中的浮点型运算问题
Jan 06 Javascript
jQuery插件slicebox实现3D动画图片轮播切换特效
Apr 12 Javascript
JavaScript中匿名函数的用法及优缺点详解
Jun 01 Javascript
微信小程序 实现tabs选项卡效果实例代码
Oct 31 Javascript
谈谈第三方App接入微信登录 解读
Dec 27 Javascript
原生js实现弹出层效果
Jan 20 Javascript
Angular2使用jQuery的方法教程
May 28 jQuery
Node.js连接mongodb实例代码
Jun 06 Javascript
ES6解构赋值的功能与用途实例分析
Oct 31 Javascript
微信小程序云开发之数据库操作
May 18 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.MVC的模板标签系统(一)
2006/09/05 PHP
Yii2隐藏frontend/web和backend/web的方法
2015/12/12 PHP
php入门教程之Zend Studio设置与开发实例
2016/09/09 PHP
一个基于jquery的文本框记数器
2012/09/19 Javascript
js使用循环清空某个div中的input标签值
2014/09/29 Javascript
JavaScript面向对象的实现方法小结
2015/04/14 Javascript
javascript带回调函数的异步脚本载入方法实例分析
2015/07/02 Javascript
浅谈addEventListener和attachEvent的区别
2016/07/14 Javascript
JavaScript制作简易计算器(不用eval)
2017/02/05 Javascript
jquery+ajax实现省市区三级联动 (封装和不封装两种方式)
2017/05/15 jQuery
jquery实现限制textarea输入字数的方法
2017/09/06 jQuery
把vue-router和express项目部署到服务器的方法
2018/02/21 Javascript
JavaScript常用事件介绍
2019/01/21 Javascript
vue基础之模板和过滤器用法实例分析
2019/03/12 Javascript
微信小程序调用微信支付接口的实现方法
2019/04/29 Javascript
微信小程序云开发之使用云函数
2019/05/17 Javascript
了解Javascript中函数作为对象的魅力
2019/06/19 Javascript
json字符串对象转换代码实例
2019/09/28 Javascript
JS实现按比例缩小图片宽高
2020/08/24 Javascript
简单介绍Python中用于求最小值的min()方法
2015/05/15 Python
python 实现在txt指定行追加文本的方法
2018/04/29 Python
Django框架实现逆向解析url的方法
2018/07/04 Python
Flask配置Cors跨域的实现
2019/07/12 Python
tensorflow实现测试时读取任意指定的check point的网络参数
2020/01/21 Python
django使用F方法更新一个对象多个对象字段的实现
2020/03/28 Python
Python 实现微信自动回复的方法
2020/09/11 Python
Python求区间正整数内所有素数之和的方法实例
2020/10/13 Python
阿玛尼美妆英国官网:Giorgio Armani Beauty英国
2019/03/28 全球购物
电信专业毕业生推荐信
2013/11/18 职场文书
运动会领导邀请函
2014/01/10 职场文书
教学实习自我评价
2014/01/28 职场文书
2014年社区工作总结
2014/11/18 职场文书
十佳少年事迹材料
2014/12/25 职场文书
七年级作文之雪景
2019/11/18 职场文书
解决pytorch读取自制数据集出现过的问题
2021/05/31 Python
MySQL提取JSON字段数据实现查询
2022/04/22 MySQL