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 相关文章推荐
jQuery 使用手册(四)
Sep 23 Javascript
js判断IE6/IE7/FF的代码[XMLHttpRequest]
Feb 16 Javascript
关于js拖拽上传 [一个拖拽上传修改头像的流程]
Jul 13 Javascript
JavaScript实现表格排序方法
Jun 14 Javascript
Extjs改变树节点的勾选状态点击按钮将复选框去掉
Nov 14 Javascript
2种jQuery 实现刮刮卡效果
Feb 01 Javascript
javascript性能优化之事件委托实例详解
Dec 12 Javascript
JavaScript队列的应用实例详解【经典数据结构】
Apr 12 Javascript
vue2.0实现导航菜单切换效果
May 08 Javascript
vue自定义全局共用函数详解
Sep 18 Javascript
详解VUE Element-UI多级菜单动态渲染的组件
Apr 25 Javascript
vant IndexBar实现的城市列表的示例代码
Nov 20 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
分割GBK中文遭遇乱码的解决方法
2013/08/09 PHP
Laravel框架路由配置总结、设置技巧大全
2014/09/03 PHP
用 Composer构建自己的 PHP 框架之使用 ORM
2014/10/30 PHP
Yii实现的多级联动下拉菜单
2016/07/13 PHP
PHP设置images目录不充许http访问的方法
2016/11/01 PHP
Mac下关于PHP环境和扩展的安装详解
2019/10/17 PHP
Thinkphp 框架配置操作之动态配置、扩展配置及批量配置实例分析
2020/05/15 PHP
用Javascript实现UTF8编码转换成gb2312编码
2006/12/22 Javascript
Javascript 面向对象 重载
2010/05/13 Javascript
关于递归运算的顺序测试代码
2011/11/30 Javascript
js获取url参数值的两种方式
2013/09/10 Javascript
用jQuery向div中添加Html文本内容的简单实现
2016/07/13 Javascript
Jquery 整理元素选取、常用方法一览表
2016/11/26 Javascript
vue router自动判断左右翻页转场动画效果
2017/10/10 Javascript
详解JavaScript对数组操作(添加/删除/截取/排序/倒序)
2019/04/28 Javascript
解决vue-router路由拦截造成死循环问题
2020/08/05 Javascript
[56:20]LGD vs VP Supermajor 败者组决赛 BO3 第三场 6.10
2018/07/04 DOTA
Python 字符串操作实现代码(截取/替换/查找/分割)
2013/06/08 Python
bat和python批量重命名文件的实现代码
2016/05/19 Python
python+influxdb+shell编写区域网络状况表
2018/07/27 Python
Python实现E-Mail收集插件实例教程
2019/02/06 Python
突袭HTML5之Javascript API扩展5—其他扩展(应用缓存/服务端消息/桌面通知)
2013/01/31 HTML / CSS
html5中audio支持音频格式的解决方法
2018/08/24 HTML / CSS
英国电信商店:BT Shop
2019/12/17 全球购物
运动会稿件100字
2014/02/21 职场文书
网吧消防安全责任书
2014/07/29 职场文书
员工趣味活动方案
2014/08/27 职场文书
保险公司演讲稿
2014/09/02 职场文书
师德自我剖析材料范文
2014/10/06 职场文书
幼师辞职信怎么写
2015/02/27 职场文书
应收账款管理制度
2015/08/06 职场文书
2016年教师节慰问信
2015/12/01 职场文书
利用Python将list列表写入文件并读取的方法汇总
2022/03/25 Python
排查Tomcat进程假死的问题
2022/05/06 Servers
SQL Server 中的事务介绍
2022/05/20 SQL Server
Pytorch中expand()的使用(扩展某个维度)
2022/07/15 Python