说三道四技术文摘-感悟人生的经典句子
说三道四 > 文档快照

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

HTML文档下载 WORD文档下载 PDF文档下载
新一代JavaScript标准ES6正式发布。【探秘ES6】系列专栏将一一剖析ES6的诸多新特性,让Web开发者对此有清晰全面的了解。本文为系列的第五篇,带你了解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 

相关阅读:

【探秘ES6】系列专栏:ES6简介

【探秘ES6】系列专栏:迭代器和for-of循环

【探秘ES6】系列专栏:生成器

【探秘ES6】系列专栏:模版字符串

欢迎加入CSDN前端交流群:218126086,进行前端技术交流。  

获取和设置ListView的选择项 EditText中显示隐藏Android输入法窗口 自定义ListView行间的分割线 Android程序完全退出的三种方法 WebView使用技巧和介绍 EditText仅允许特定类型数据输入 自定义Android应用的访问权限 android.text.format文件大小和日期解析类 Android Rootkit相关揭秘 androidmanifest.xml高级属性解析 根据packageName构造Context SQLite操作,还是raw方法更简洁高效 Android开发基础YesNo对话框构造代码 Android代码性能优化技巧 Android开发注意点 Part One onSaveInstanceState和onRestoreInstanceState的用处 Android基础概念Context的作用 在Android的Notification中显示进度条 Android跨进程数据通讯-剪切板Clipboard ConditionVariable Android线程同步 Android软件开发方向指导 ArrayList LinkedList Set HashMap介绍 PermissionInfo Android权限枚举方法 Android上HTTP协议通讯状态获取 Android开发需要自己完善的类库总结 Android的ListView控件滚动时背景问题 GestureDetector手势识别类 - 进阶篇 MenuInflater Android菜单从xml创建方法 EditText输入提示你知道吗? Android布局Java代码构造法 Android全屏设置代码 我急!深夜提问!大家看一看 有谁告诉我Microsoft Visual InterDev 6.0如何使用其中的站点管理 如何在Word工具条上加一个按钮 请问系统和上网的速度有关系吗 急需foxpro for win版,哪有??? 请教一下,ado.net里如何返回表里的行数? 如何在HTML页面中使用 Acrobat 的 PDF 阅读器控件 关于一个遗传算法得问题!! 请问一个TSR问题! 关于跨数据库查询的问题 请问在ListBox中可不可以将每一行字符串设置成不同的颜色? vb6.0中如何将dbgrid里的内容添加到数据库里? 请问怎样才能将窗体上的最大化按钮设置成无用,而保留最小化按钮? 各位专家:请问win2000 PRO 下的config.msi目录中的好多以rbf为扩展名的文件是什么文件?有什么用?可以删除吗? ASP.NET中DATAGRILD的烦人处 新手问两个简单的问题??? 想知道如何才能看见前页纸油笔写过后留下的字迹?(散分) 为什么用odbc连接的paradox表不能编辑? 哪位大侠帮看一下代码(关于链表),为何出"invalid type argument of `->'"的错 一个非常非常想从事计算机软件开发的愿望 关于Hook的一个小问题 文档视图结构中无法显示编辑框,怎么办啊??用什么代替啊 十万火急! 通过网络,进行语音聊天的程序。 你了解人工受精吗? 有关“无纸化考试系统”bow api中的常量 关于addslashes的问题 有关“无纸化考试系统”的问题??thanks all,bow 如何删除windowsXP?紧急!!! 【数据结构】考试用的是类pascal还是c语言 我想往服务器中传文件。请问,需要组件吗? 如何写naked function的prolog 和 epilog? LoadIcon(NULL,IDR_QQ) 关于用c写聊天室 帮忙看看是不是session_start()惹的祸 请问谁知道那里有php源码下载的好站,贴几个出来看看 一妹妹姐姐程序员求职,找深圳的工作 初级问题:RichEdit控件的ScrollBy方法自动滚动 推荐一个毕业设计题目,不要太难,我学的流体,用VC来做一个什么东西,推荐一个,谢谢. 今天中午饭后练习时台球斯诺克单杠52分~~~ 二个问题,第二个问题比较难! Windows.Net 3607 简体中文版下载,要的话赶快,不然链接要被删除了. From left to right: Jini, Mini, and Umji 请问我应该如何把图片存储在数据库里啊(急啊) 成都的高程何时报名,在哪,电话,何时考?? 有关access与sql的比较。 百思不解,请指点迷津 看点什么好 在PB作安全管理时,要编历菜单,而我问的问题是... 发现触发器的问题 有个小问题.请高手们回复一下.谢谢 在Rt△ABC中,角C=90°,a:b等于3:4,c=20,则a=___,b=___? Rt三角形ABC中,角c=90度,AC=5,BC=12,圆O经过A,B,C三点,则圆O的半径为 一个三位数,十位上是0,个位与百位上的数字之和是9,如果把这个三位数的个位数字与百位数字对调,则得到的新三位数比原三位数大693,求原来的三位数 在Rt△ABC中,∠C=90°(1)已知a=6,c=10,求b;(2)已知c=25,b=15,求a 如何将一寸照片PS为宽130高160,宽高为1.3比1.6,且像素大小在30k一下我已在ps里将宽130高160设好了,但比例不知怎么设,上面显示文档大小的宽度为1.1厘米,高度为1.35厘米,如我将文档大小改为宽1.3 一个三位数,十位上是0,个位与百位上的数字之和是9,如果把这个三位数的个位数字与百位数字对调,则得 在Rt△ABC中,∠C=90°,∠A、∠B、∠C所对的边分别为a、b、c (1)已知a :b=3 :4,c=25求a和b;在Rt△ABC中,∠C=90°,∠A、∠B、∠C所对的边分别为a、b、c (1)已知a :b=3 :4,c=25,求a和b;(2)已知a :c=5 :13,b 在△ABc中,AB=17,Bc=16,Bc边上的中线AD=15,试证明△ABc是等腰三角形 一个三位数,十位上是0,个位上与百位上的数字之和是9,如果把这个三位数的个位与百位对调,则得到新的三位数比原来的三位数大693,求原来的三位数. 照片像素250*350是什么意思,指的是长和宽吗,各是多少呢? 已知:如图,在△ABC中,AB=13,BC=10,BC边上的中线AD=12.求证:△ABC是等腰三角形 一个三位数,十位数上是0.个位与百位上的数字之和是9.如果百位和各位对调之后两数相差693.求原来的三位有算式 怎样使照片的大小变成小于500KB?照片长边1000像素是什么意思? 在rt三角形abc中,角c是90度,ac是3,bc是4.以c为圆心,当半径是2.4时,r与ab有什么位置关系? 关于确定一次函数表达式的题.已知y与x成正比例,且x=3时,y=-6,则y与x的函数关系式是?若直线y=kx+1,经过点(3,2),则k=?已知一次函数y=kx-2,当x=2时,y=-6,则当x=-3时,y=?若一次函数y=kx-(2k+1)的图像与y轴交 1寸照片的长宽各是多少像素? 在RT三角形ABC中,角B =90',AB=6厘米,BC=8厘米.点P由A 出发沿AB,边向点B 以1厘米/S的速度移动,点Q由点B 出发沿BC 边向C 以2厘米/S的速度移动.如果点P,Q 分别从点A,B 同时出发,那么经过几秒后QP平行AB?有 确定一次函数表达式的两道简单题1.已知一次函数的图像过点(0,1)和点(2,-1)点M(m,二分之一)在图像上,则m的值是______.2.一次函数y=bx+2的图像经过点A(-1,1),则b=_____.写出方法教我 如图,在△ABC中,AD⊥BC于点D,AB=AC,过点B作射线BP分别交AD、AC于点E、F,与过点C且平行于AB的直线交于点P.试说明EB²=EF·EP Rt三角形ABC中,角C=90°,AC=3cm,BC=4cm,以C为圆心,r为半径的圆与AB有什么位置关系?1、r=2cm 2、r=2.4cm 3、r=3cm’ 有一个三位数,个位数字为百位数字的2倍,十位数字比百位数字大1,若将此数个位数字与百位数字顺序对调,所得的新数比原数的2倍少49,求原数. 已知AD是三角形ABC的中线,过点B作射线交AD,AC于点E,F,与过点C且平行于AB的直线交于点G,求证BE^2=EF*EG 宽度约为130像素,高度约为160像素,宽高比例为1.3:1.6左右,jpg格式,30kb 以下.急. 有一个三位数,个位数字为百位数字的2倍,十位数字比百位数字大1,若将此数个位于百位顺序对调(个位变百位)所得的新数比原数的2倍少49,求原数 直角三角形两直角边的长分别为5厘米和12厘米,则斜边上的中线长为多少 宽度约为130像素(110~160之间),高度约为160像素(130~200之间),宽高比例为1.3:1.6左右,近期正面免冠1寸 有一个三位数,个位数字为百位数字的2倍,十位数字比百位数字大1,若将此数个位与百位顺序对调 直角三角形斜边上的中线长为4,则该直角三角形两直角边的平方和等于 一元二次方程(x-1)(x-2)=0的两个根为x1,x2,且x1,x2,且x1>x2,则x1-2x= 直角三角形两直角边分别为5厘米,12厘米.其斜边上高为多少 已知直角三角形中的两条边长分别为3和4,则斜边上的中线长是多少? 再出三道这样的题 各位大神已知直角三角形中的两条边长分别为3和4,则斜边上的中线长是多少?再出三道这样的题各位大神 数学七年级第七章与三角形有关的角.CE是ABC的外角角ACD的平分线,且CE交BA的延长线于点E,证明角BAC大于数学七年级第七章与三角形有关的角。CE是ABC的外角角ACD的平分线,且CE交BA的延长线于点 一个直角三角形他的两条直角边分别是3分米和4分米,斜边是5分米,求他的斜边上高是多少?女儿的数学题 俩个三角=3个方块3个方块=4个圆一个三角+一个方块+2个圆=400那么三角是多少?方块 CF是三角形ABC的外角∠ACD的平分线,且CE交BA的延长线于点E,证明∠BAC>∠B.这道问题在初一下册数学书的第77页的第10题(人教版)注意结尾是∠BAC>∠B.而不是“=”. 一个等腰直角三角形斜边和斜边上高的和是21则斜边的长是多少 在三角形ABC中,AB=17,BC=16,BC边上的中线AD=15,三角形ABC是等腰三角形吗?为什么? CE是三角形ABC的外角角ACD的平分线,且CE交BA的延长线于点E,证明角BAC等于角B加2角 一个直角三角形3,4,5 斜边上高线分成2个直角三角形,这两个小三角形的内心连线长度 在Rt三角形ABC中,角C=90°,AB=5,B=4,则cosA=-------. 在RT三角形ABC中,角C=90度,AC=5,BC=12,以C为圆心,R为半径画圆,若圆C与边AB有两个公共点,则R的取值范围是 CE是三角形ABC的外角,角ACD的平分线,且CE交BA的延长线天点E,证明角BACD大于角B 15 25 56 1225哪个数既是三角数也是正方行数 已知三角形ABC中,AB=17.BC=16.BC边上的中线AD=15,试说明三角形ABC是等腰三角形 如图在三角形abc中,ab=17,bc=16,bc边上的中线ad为15,三角形abc是等腰三角形吗?为什么 直角三角形斜边上的高与中线分别为5和6 则它的面积是多少 在Rt三角形ABC中,角C=90度,BC=3,AC=4,以B为圆心,BC长为半径作圆B,问:点A,C及AB,AC的中点D,E与圆B有怎样的位置关系 在△ABC中,AB=17,BC=16,BC边上的中线AD=15,求ABC的形状 如果直角三角形斜边上的高,中线的长分别是4,5,那么直角三角形的面积是____ 等腰直角三角形ABC中∠C=90度,点D是BC上任意一点,连接AD,过点B作BE⊥AD,交射线AD于点E,连接CE求∠AEC数等腰直角三角形ABC中,∠C=90度,点D是BC上任意一点,连接AD,过点B作BE⊥AD,交射线AD于点E,连接CE, 已知a+b+c=3,a^2+b^2+c^2=3,求a^2010+b^2011+c^2012 在直角三角形中,直角边上的中线分别长为4和7,斜边上的高为6,求直角三角形的面积 在三角形ABC中,点D是BC的中点,作射线AD,在线段AD急其延长线上分别取点E.F,连接CE.BF,添加一个条件,使得三角形BDF~=三角形CDE,并加以证明.你添加的条件是 已知c为负整数,且a,b,c满足(a-1)^+|2b+2|=1+c,则(a+b)^2009+a^2010+b^2011+c^2012= 已知直角三角形斜边上的高及斜边上的中线分别为5和6,则此直角三角形的面积为多少 已知实数a使得三个一元二次方程,x2-X+a=0 x2-2x+a=0 x2-4x+a=0 至少有一个方程有解,求a的取值范围 如果2010分之A=2011分之B=2012分之C,则A:B:C= 在RT三角形ABC中,∠C=90° (1)已知c=25,b=15,求a (2)已知a=12,∠A=60°,求b,c 如图,在RT三角形ABC中,∠C=90°,AC=3,BC=4.动点O在边CA上移动,且圆O的半径为2当OC等于多少时,圆o与直线AB相切? 已知a=2011x+2010,b=2011x+2011,c=2011x+2012,求a2+b2+c2-ab-ac-bc的值a2,b2,c2,为a的平方,b的平方,c的平方.
备案号:鲁ICP备13029499号-2 说三道四 www.s3d4.cn 说三道四技术文摘