ES6中参数的默认值语法介绍


Posted in Javascript onMay 03, 2017

前言

在ES6如果函数参数没有值或未定义的,默认函数参数允许将初始值初始化为默认值。下面来看看详细的介绍吧。

语法

function [name]([param1[ = defaultValue1 ][, ..., paramN[ = defaultValueN ]]]) 
{
 statements
}

描述

在JavaScript中,函数默认参数定义。然而,在某些情况下,设置不同的默认值可能是有用的。这是默认参数可以帮助的地方。

在过去,设置默认值的一般策略是在函数体中测试参数值,如果它们是未定义的就分配一个值。如果在下面的例子中,在调用过程中b没有提供值,它的值将是undefined 当对 a*b 求值并且调用这个乘法的时候将返回NaN。

function multiply(a, b) {
var b = (typeof b !== 'undefined') ? b : 1;

return a*b;
}

multiply(5); // 5

在ES6中设置默认参数,对函数体的检查是不必须的了。现在,你可以简单的在函数头设置默认值:

function multiply(a, b = 1) {
 return a*b;
}

multiply(5); // 5

例子

通过未定义

在第二个函数调用中,即使第二个参数明确地被设置为undefined(虽然不是null),但是这个函数的颜色参数有一个默认值。

function setBackgroundColor(element, color = 'rosybrown') {
 element.style.backgroundColor = color;
}

setBackgroundColor(someDiv);   // color set to 'rosybrown'
setBackgroundColor(someDiv, undefined); // color set to 'rosybrown' too
setBackgroundColor(someDiv, 'blue'); // color set to 'blue'

调用时求值

默认参数在调用时计算的,所以不像在Python中,一个新的对象是每次调用函数创建。

function append(value, array = []) {
array.push(value);
return array;
}

append(1); //[1]
append(2); //[2], not [1, 2]

甚至适合于函数和变量

function callSomething(thing = something()) { return thing }

function something(){
 return "sth";
}

callSomething(); //sth

默认参数可以提供给以后的默认参数

已经遇到的参数可以提供给以后的默认参数:

function singularAutoPlural(singular, plural = singular+"s",
       rallyingCry = plural + " ATTACK!!!") {
 return [singular, plural, rallyingCry ];
}

//["Gecko","Geckos", "Geckos ATTACK!!!"]
singularAutoPlural("Gecko");

//["Fox","Foxes", "Foxes ATTACK!!!"]
singularAutoPlural("Fox","Foxes");

//["Deer", "Deer", "Deer ... change."]
singularAutoPlural("Deer", "Deer", "Deer peaceably and respectfully
 petition the government for positive change.")

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
Kibo 用于处理键盘事件的Javascript工具库
Oct 28 Javascript
jquery.messager.js插件导致页面抖动的解决方法
Jul 14 Javascript
cookie的复制与使用记住用户名实现代码
Nov 04 Javascript
Javascript异步编程模型Promise模式详细介绍
May 08 Javascript
JS延时提示框实现方法详解
Nov 26 Javascript
Bootstrap前端开发案例一
Jun 17 Javascript
利用Angularjs和Bootstrap前端开发案例实战
Aug 27 Javascript
微信小程序 二维码canvas绘制实例详解
Jan 06 Javascript
vue.js中指令Directives详解
Mar 20 Javascript
jQuery实现获取及设置CSS样式操作详解
Sep 05 jQuery
原生JS实现旋转轮播图+文字内容切换效果【附源码】
Sep 29 Javascript
js实现AI五子棋人机大战
May 28 Javascript
Express之get,pos请求参数的获取
May 02 #Javascript
利用prop-types第三方库对组件的props中的变量进行类型检测
May 02 #Javascript
xmlplus组件设计系列之路由(ViewStack)(7)
May 02 #Javascript
JavaScript比较两个数组的内容是否相同(推荐)
May 02 #Javascript
xmlplus组件设计系列之分隔框(DividedBox)(8)
May 02 #Javascript
xmlplus组件设计系列之树(Tree)(9)
May 02 #Javascript
详解Vue2.X的路由管理记录之 钩子函数(切割流水线)
May 02 #Javascript
You might like
DIY实用性框形天线
2021/03/02 无线电
jQuery 源码分析笔记
2011/05/25 PHP
php 转换字符串编码 iconv与mb_convert_encoding的区别说明
2011/11/10 PHP
克隆一个新项目的快捷方式
2013/04/10 PHP
深入理解:单一入口、MVC、ORM、CURD、ActiveRecord概念
2013/06/06 PHP
PHP中如何判断exec函数执行成功?
2016/08/04 PHP
PHP读取XML格式文件的方法总结
2017/02/27 PHP
PHP7如何开启Opcode打造强悍性能详解
2018/05/11 PHP
PHP+redis实现微博的推模型案例分析
2019/07/10 PHP
PHP封装请求类实例分析【基于Yii框架】
2019/10/17 PHP
thinkphp框架类库扩展操作示例
2019/11/26 PHP
js apply/call/caller/callee/bind使用方法与区别分析
2009/10/28 Javascript
完美兼容IE,chrome,ff的设为首页、加入收藏及保存到桌面js代码
2014/12/17 Javascript
JS数组的常见用法实例
2015/02/10 Javascript
使用Javascript实现选择下拉菜单互移并排序
2016/02/23 Javascript
关于Javascript中defer和async的区别总结
2016/09/20 Javascript
详解webpack的配置文件entry与output
2017/08/21 Javascript
JavaScript requestAnimationFrame动画详解
2017/09/14 Javascript
webuploader实现上传图片到服务器功能
2018/08/16 Javascript
JavaScript错误处理操作实例详解
2019/01/04 Javascript
angular中如何绑定iframe中src的方法
2019/02/01 Javascript
jquery+ajax实现上传图片并显示上传进度功能【附php后台接收】
2019/06/06 jQuery
angular组件间通讯的实现方法示例
2020/05/07 Javascript
解决vue单页面 回退页面 keeplive 缓存问题
2020/07/22 Javascript
JavaScript 生成唯一ID的几种方式
2021/02/19 Javascript
python模拟登陆阿里妈妈生成商品推广链接
2014/04/03 Python
Python的Flask框架的简介和安装方法
2015/11/13 Python
python实现可以断点续传和并发的ftp程序
2016/09/13 Python
Python3 导入上级目录中的模块实例
2019/02/16 Python
如何在django中运行scrapy框架
2020/04/22 Python
CSS3 box-sizing属性
2009/04/17 HTML / CSS
GUESS德国官网:美国牛仔服装品牌
2017/02/14 全球购物
维多利亚的秘密阿联酋官网:Victoria’s Secret阿联酋
2019/12/07 全球购物
2014购房个人委托书范本
2014/10/12 职场文书
婚礼迎宾词大全
2015/08/10 职场文书
JavaScript 语句之常用 for 循环详解
2021/03/29 Javascript