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 相关文章推荐
JavaScript 模拟用户单击事件
Dec 31 Javascript
javascript下判断一个对象是否具有指定名称的属性的的代码
Jan 11 Javascript
JavaScript写的一个自定义弹出式对话框代码
Jan 17 Javascript
JS+CSS实现下拉列表框美化效果(3款)
Aug 15 Javascript
基于jquery实现左右按钮点击的图片切换效果
Jan 27 Javascript
js数组的五种迭代方法及两种归并方法(推荐)
Jun 14 Javascript
Node.js 日志处理模块log4js
Aug 28 Javascript
微信小程序 rich-text的使用方法
Aug 04 Javascript
JavaScript事件委托原理与用法实例分析
Jun 07 Javascript
vue-cli3 项目优化之通过 node 自动生成组件模板 generate View、Component
Apr 30 Javascript
对Layer UI 模块化的用法详解
Sep 26 Javascript
vue组件库的在线主题编辑器的实现思路
Apr 03 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
yii框架源码分析之创建controller代码
2011/06/28 PHP
php实现的常见排序算法汇总
2014/09/08 PHP
完美实现wordpress禁止文章修订和自动保存的方法
2014/11/03 PHP
php实现当前页面点击下载文件的实例代码
2016/11/16 PHP
javascript 一些用法小结
2009/09/11 Javascript
某人初学javascript的时候写的学习笔记
2010/12/30 Javascript
获取body标签的两种方法
2011/10/13 Javascript
javascript 操作符(~、&、|、^、)使用案例
2014/12/31 Javascript
js实现鼠标点击文本框自动选中内容的方法
2015/08/20 Javascript
谈一谈javascript中继承的多种方式
2016/02/19 Javascript
jqGrid翻页时数据选中丢失问题的解决办法
2017/02/13 Javascript
js中数组插入、删除元素操作的方法
2017/02/15 Javascript
jQuery实现的动态文字变化输出效果示例【附演示与demo源码下载】
2017/03/24 jQuery
NodeJS实现自定义流的方法
2018/08/01 NodeJs
Vue 使用Props属性实现父子组件的动态传值详解
2019/11/13 Javascript
JavaScript大数相加相乘的实现方法实例
2020/10/18 Javascript
python基础教程之获取本机ip数据包示例
2014/02/10 Python
在Python中用keys()方法返回字典键的教程
2015/05/21 Python
Python 迭代器与生成器实例详解
2017/05/18 Python
python中模块查找的原理与方法详解
2017/08/11 Python
python的mysqldb安装步骤详解
2017/08/14 Python
Python中的id()函数指的什么
2017/10/17 Python
Python 读取图片文件为矩阵和保存矩阵为图片的方法
2018/04/27 Python
python实现可逆简单的加密算法
2019/03/22 Python
在django中使用apscheduler 执行计划任务的实现方法
2020/02/11 Python
Django xadmin安装及使用详解
2020/10/26 Python
俄罗斯在线手表和珠宝商店:AllTime
2019/09/28 全球购物
Optimalprint加拿大:在线打印服务
2020/04/03 全球购物
计算机多媒体专业自荐信
2014/07/04 职场文书
党的群众路线整改落实情况汇报
2014/10/28 职场文书
2014年人民调解工作总结
2014/12/08 职场文书
银行员工考核评语
2014/12/31 职场文书
客房领班岗位职责
2015/02/11 职场文书
大学军训心得体会800字
2016/01/11 职场文书
MySQL 使用SQL语句修改表名的实现
2021/04/07 MySQL
Pytorch实现图像识别之数字识别(附详细注释)
2021/05/11 Python