写点什么

深入浅出 ES6(五):不定参数和默认参数

  • 2015-07-06
  • 本文字数:2618 字

    阅读完需:约 9 分钟

编者按:ECMAScript 6 已经正式发布了,作为它最重要的方言,Javascript 也即将迎来语法上的重大变革,InfoQ 特开设“深入浅出ES6 ”专栏,来看一下ES6 将给我们带来哪些新内容。本专栏文章来自 Mozilla Web 开发者博客,由作者授权翻译并发布。

今天这篇文章将为你带来两个使 JavaScript 函数语法更富表现力的新特性:不定参数和默认参数。

不定参数

我们通常使用可变参函数来构造 API,可变参函数可接受任意数量的参数。例如, String.prototype.concat 方法就可以接受任意数量的字符串参数。ES6 提供了一种编写可变参函数的新方式——不定参数。

我们通过一个简单的可变参数函数 containsAll 给大家演示不定参数的用法。函数 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;
}

在这个实现中,我们用到了神奇的 arguments 对象,它是一个类数组对象,其中包含了传递给函数的所有参数。这段代码实现了我们的需求,但它的可读性却不是最理想的。函数的参数列表中只有一个参数 haystack,我们无法一眼就看出这个函数实际上接受了多个参数。另外,我们一定要注意,应该从 1 开始迭代,而不是从 0 开始,因为 arguments[0] 相当于参数 haystack。如果我们想要在 haystack 前后添加另一个参数,我们一定要记得更新循环体。不定参数恰好可以解决可读性与参数索引的问题。下面是用 ES6 不定参数特性实现的 containsAll 函数:

复制代码
function containsAll(haystack, ...needles) {
for (var needle of needles) {
if (haystack.indexOf(needle) === -1) {
return false;
}
}
return true;
}

这一版 containsAll 函数与前者有相同的行为,但这一版中使用了一个特殊的…needles 语法。我们来看一下调用 containsAll(“banana”, “b”, “nan”) 之后的函数调用过程,与之前一样,传递进来的第一个参数"banana"赋值给参数 haystack,needles 前的省略号表明它是一个不定参数,所有传递进来的其它参数都被放到一个数组中,赋值给变量 needles。对于我们的调用示例而言,needles 被赋值为 [“b”, “nan”],后续的函数执行过程一如往常。(注意啦,我们已经使用过 ES6 中 for-of 循环。)

在所有函数参数中,只有最后一个才可以被标记为不定参数。函数被调用时,不定参数前的所有参数都正常填充,任何“额外的”参数都被放进一个数组中并赋值给不定参数。如果没有额外的参数,不定参数就是一个空数组,它永远不会是 undefined。

默认参数

通常来说,函数调用者不需要传递所有可能存在的参数,没有被传递的参数可由感知到的默认参数进行填充。JavaScript 有严格的默认参数格式,未被传值的参数默认为 undefined。ES6 引入了一种新方式,可以指定任意参数的默认值。

下面是一个简单的示例(反撇号表示模板字符串,上周已经讨论过。):

复制代码
function animalSentence(animals2="tigers", animals3="bears") {
return `Lions and ${animals2} and ${animals3}! Oh my!`;
}

默认参数的定义形式为 [param1[ = defaultValue1 ][, …, paramN[ = defaultValueN ]]],对于每个参数而言,定义默认值时 = 后的部分是一个表达式,如果调用者没有传递相应参数,将使用该表达式的值作为参数默认值。相关示例如下:

复制代码
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) {...}## 停止使用 arguments

现在我们已经看到了 arguments 对象可被不定参数和默认参数完美代替,移除 arguments 后通常会使代码更易于阅读。除了破坏可读性外,众所周知,针对 arguments 对象对 JavaScript 虚拟机进行的优化会导致一些让你头疼不已的问题。

我们期待着不定参数和默认参数可以完全取代 arguments,要实现这个目标,标准中增加了相应的限制:在使用不定参数或默认参数的函数中禁止使用 arguments 对象。曾经实现过 arguments 的引擎不会立即移除对它的支持,当然,现在更推荐使用不定参数和默认参数。

浏览器支持

Firefox 早在第 15 版的时候就支持了不定参数和默认参数。

不幸的是,尚未有其它已发布的浏览器支持不定参数和默认参数。V8 引擎最近增添了针对不定参数的实验性的支持,并且有一个开放状态的V8 issue 给实现默认参数使用,JSC 同样也有一个开放的 issue 来给不定参数默认参数使用。

Babel Traceur 编译器都支持默认参数,所以从现在起就可以开始使用。

文后盘点

尽管技术上不支持任何新的行为,不定参数和参数默认值还是可以使一些 JavaScript 函数定义更富有表现力并且更加可读。调用时自然也更加舒爽!

鸣谢:感谢 Benjamin Peterson 在 Firefox 中实现了这些特性,同时感谢他对于整个项目的贡献,以及他用心撰写了本篇文章。

在下一篇文章中,我们将介绍另外一个简单、优雅、实用,同样是你每天都会用到的 ES6 特性。这篇文章中用到了你平时用来写数组和对象的熟悉的语法,并为这些语法润色,产生一个新的、简洁的方式来拆解数组和对象。那意味着什么呢?为什么要拆解对象?敬请期待 Mozilla 工程师 Nick Fitzgerald 为我们带来的《深入浅出 ES6 解构》。

2015-07-06 07:1651827
用户头像

发布了 63 篇内容, 共 132.9 次阅读, 收获喜欢 38 次。

关注

评论

发布
暂无评论
发现更多内容

深圳市数字经济指数发布:数字经济蓬勃发展,数字用户深度渗透

易观分析

数字经济 深圳

《深入理解JavaScript特性》学习总结2-ES6基础知识点总结

肥晨

11月月更 ES6基础知识点总结 解构赋值

大数据培训和自学哪种方式更好

小谷哥

【web 开发基础】PHP 自定义函数之函数的返回值-PHP 快速入门 (27)

迷彩

web开发基础 PHP基础 11月月更 return

蚌住了!这份阿里P8写的Java多线程编程实战指南就这么容易开源?

小二,上酒上酒

Java 面试 多线程 阿里 大厂面试

java培训学习该怎么做?

小谷哥

为什么面试官狂问八股文?我已经被三家公司问到哑口无言……

程序知音

Java java面试 java架构 后端技术 Java面试八股文

完整会议议程:NGINX Sprint China 2022 年度线上大会

NGINX开源社区

nginx

Meta Force 原力元宇宙dapp系统开发(智能合约部署)

开发微hkkf5566

redhat运维-远程日志记录

阿柠xn

运维 日志 linux 文件权限控制 11月月更

《深入理解JavaScript特性》学习总结1-ES6基础知识点总结

肥晨

箭头函数 11月月更 ES6基础知识点总结

前端培训班中如何学习前端开发技术

小谷哥

最新出炉!开源 API 网关的性能对比:APISIX 3.0 和 Kong 3.0

API7.ai 技术团队

kong api 网关 APISIX

低学历并不是阻碍职业发展的绊脚石

测吧(北京)科技有限公司

软件测试

CSS修改单选框样式(element)

肥晨

11月月更 单选框样式修改 element单选框样式

万物皆可集成系列:低代码对接Web Service接口

葡萄城技术团队

袋鼠云数栈UI5.0体验升级背后的故事:可用性原则与交互升级

袋鼠云数栈

大规模预训练模型:探讨与展望

澜舟孟子开源社区

商业银行普惠金融可持续发展综合能力呈现梯队化,专项领域各有所长

易观分析

普惠金融

阿里P8偷偷把内网分享的SpringCloud微服务架构精髓手册开源了

小二,上酒上酒

架构 面试 微服务 Spring Cloud

为什么晶闸管能在大电流下工作?

元器件秋姐

元器件采购 元器件电商 元器件知识 华秋商城 晶闸管

2022开源之夏|EMQ三大开源项目开发圆满收官

EMQ映云科技

开源 物联网 IoT mqtt 11月月更

神了!阿里P8纯手写出了这份10W字的MyBatis技术原理实战开发手册

小二,上酒上酒

学习 编程 面试 mybatis

这些小技巧,让你的前端编程更优雅

好程序员IT教育

前端

好家伙!阿里P8撰写的Java微服务架构全栈笔记GitHub一夜飞到榜首

小二,上酒上酒

Java 架构 面试 微服务

20个值得收藏的实用JavaScript技巧

千锋IT教育

3年测试经验跳槽成功拿下30W+年薪

测吧(北京)科技有限公司

软件测试

Github上架3天星标55K,阿里最新产架构师速成手册成功颠覆了我的认知

程序员小毕

分布式 微服务 程序人生 架构师 Java后端

自学前端技术怎么样,有必要去吗

小谷哥

遭MQ连连干翻后的醒悟!含恨码出5本MQ学习手册助力秋招之旅

小二,上酒上酒

面试 RocketMQ 大厂 大厂面试

爆肝了!阿里出版的这份Spring Security源码手册,狂揽GitHub榜首

小二,上酒上酒

Java 面试 spring security 大厂 大厂面试

深入浅出ES6(五):不定参数和默认参数_JavaScript_Benjamin Peterson_InfoQ精选文章