【探秘ES6】系列专栏：剩余参数和默认参数
ES6作为新一代JavaScript标准，正式与广大前端开发者见面。为了让大家对ES6的诸多新特性有更深入的了解，Mozilla Web开发者博客推出了《 ES6 In Depth 》系列文章。CSDN已获授权，将持续对该系列进行翻译，供大家学习借鉴。本文为该系列的第五篇。
本文讲述的是有关ES6剩余参数（Rest parameters）和默认参数（Defaults parameters）的使用。
剩余参数（Rest parameters）
当需要创建一个可变函数API时，该函数需要实现任意数目参数的输入。例如， String.prototype.concat 方法可接受任意数目的字符串参数输入。而在ES6中，可利用剩余参数来转变实现思路。
以下将结合实例说明。containsAll是一个可变函数，用于检测字符串是否包含成分子串。例如，containsAll("banana", "b", "nan")返回true，containsAll("banana", "c", "nan")则返回false。
采用传统写法的代码如下：
function containsAll(haystack) { for (var i = 1; i < arguments.length; i++) { var needle = arguments[i]; if (haystack.indexOf(needle) === -1) { return false; } } return true; } 该方法的核心是利用了 参数对象 ，以数组的方式向函数传入参数。它完全满足需求，但可读性差。其函数参数仅是唯一的haystack，因此很难一眼就看出到底包含了哪些参数。此外，在进行递归运算时，需要注意初始位置的索引号是1而不是0，因为arguments[0]对应的是haystack参数。最后假若需要在haystack的前或后添加别的参数，那么就不得不对循环进行更新。如果换用剩余参数，这些问题皆可一一迎刃而解。
使用剩余参数的代码如下：
function containsAll(haystack, ...needles) { for (var needle of needles) { if (haystack.indexOf(needle) === -1) { return false; } } return true; } 该方法实现了与传统写法一样的功能，区别是使用了特殊的语法...needles。那么对于containsAll("banana", "b", "nan")，其运算过程是怎么样的呢？首先haystack被第一个参数banana填充；位于needles前的符号...表明needles为剩余参数；以后的其它参数会被放入一个数组然后再分配给变量needles，本例中为["b", "nan"]；之后的判断过程按常规执行。（注：这里使用了for-of 循环语法）
要提醒一点，只有位于最末的参数可被标记为剩余参数。位于剩余参数之前的参数与普通参数的处理方式是一样的。所有的额外参数都会被放入一个数组然后再分配给剩余参数。如果没有额外参数，剩余参数则为一个空数组；剩余参数不能被赋值为undefined。
默认参数（Default parameters）
很多时候，函数对传入的参数不一定全都进行处理，同时默认参数亦可以替代传入参数来进行使用。JavaScript一直以来在默认参数的处理上都显得比较笨拙；无值参数会被看作undefined。ES6里引入了特殊的默认参数处理方式。
请看下面的例子。
function animalSentence(animals2="tigers", animals3="bears") { return `Lions and ${animals2} and ${animals3}! Oh my!`; } 对上述函数中每个参数来说，=之后的赋值表达式作用是为参数进行默认取值。因此， animalSentence() 返回“Lions and tigers and bears! Oh my!”，animalSentence("elephants") 返回“Lions and elephants and bears! Oh my!”，animalSentence("elephants", "whales") 返回“Lions and elephants and whales! Oh my!”。
使用默认参数时，有几点需要留意。
- 不同于Python，默认值表达式在函数调用的时候进行求值。也就是说，默认表达式可以使用已定义的参数值。例如把上述动物例子的函数改为较特别的方式：
function animalSentenceFancy(animals2="tigers", animals3=(animals2 == "bears") ? "sealions" : "bears") { return `Lions and ${animals2} and ${animals3}! Oh my!`; } 其结果是：animalSentenceFancy("bears") 返回的是 “Lions and bears and sealions. Oh my!”。
- 取值undefined的作用等于是没有传入任何东西。因此，animalSentence(undefined, "unicorns") 返回的是 "Lions and tigers and unicorns! Oh my!"
- 没有显式定义的默认参数等同于undefined，因此：
function myFunc(a=42, b) {...} 等同于
function myFunc(a=42, b=undefined) {...} 小结
ES6对剩余参数和默认参数使得JS函数的声明更具可读性和表达性，不妨动手试试。（译者：伍昆 责编：陈秋歌）
原文链接： ES6 In Depth: Rest parameters and defaults
本译文遵循Creative Commons Attribution Share-Alike License v3.0
正文到此结束
热门推荐
相关文章
近期评论
-
666
-
文章和留言都翻到11页了 没有OOM
-
-
朋友，翻页到11页，及以后，会出现OOM，无法访问
-
-
-
-
版本号是多少，你可以下载哪个代码仓库，jdk选1.8 直接跑就行
-
-
Loading...
![[HBLOG]公众号](https://www.liuhaihua.cn/img/qrcode_gzh.jpg)
