转载

【探秘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

正文到此结束

所属分类：编程技术

本文标签： 开发者参数 cat REST 实例 js 需求 ip 代码翻译 SDN web API java NSA 开发
版权声明： 本文为互联网转载文章，出处已在文章中说明(部分除外)。如果侵权，请联系本站长删除，谢谢。
本文海报： 生成海报一生成海报二

其他链接

关于本站

本站定位：个人技术类博客

本站作用：写博客、记日志、闲聊扯淡鼓捣技术。

问题交流

【探秘ES6】系列专栏：剩余参数和默认参数

热门推荐

相关文章

说给你听

本文目录

随机标签

书籍教程

近期评论

网站信息

其他链接

关于本站

问题交流