资讯专栏INFORMATION COLUMN

es6基础0x004:剩余参数

waltr / 537人阅读

摘要:概述剩余参数将没有对应形参的参数聚合成一个数组语法只聚合未对应形参参数剩余参数只会将没有对应形参的参数聚合成一个数组而则是包含了所有的参数。剩余参数是数组剩余参数始终是一个数组,而不像是一个伪数组转化成数组解构剩余参数使用翻译翻译后

0x000 概述

剩余参数将没有对应形参的参数聚合成一个数组

0x001 语法
function(a, b, ...theArgs) {
}
0x002 只聚合未对应形参参数

剩余参数只会将没有对应形参的参数聚合成一个数组, 而arguments则是包含了所有的参数。

function add(a, b, ...theArgs) {
    return {rest: theArgs, arguments}
}
add() 
// {rest: [undefined, undefined, []], arguments: Arguments(0)}
add(1) 
// {rest: [1, undefined, []], arguments: Arguments(1)}
add(1, 2) 
// {rest: [1, 2, []], arguments: Arguments(2)}
add(1, 2, 3, 4, 5) 
// {rest: [1, 2, [3, 4, 5]], arguments: Arguments(5)}
0x003 剩余参数是数组

剩余参数始终是一个数组,而不像arguments是一个伪数组

function add(...theArgs) {
    console.log(Array.isArray(theArgs))
    theArgs.forEach((a)=>console.log(a))
    console.log(Array.isArray(arguments))
    Array.prototype.slice.call(arguments, add.length).forEach((a)=>console.log(a)) // 转化成数组
}
add(1,2,3) // true 1 2 3 false 1, 2, 3, 4
0x004 解构剩余参数
function add(...[a, b, c]){
    return a + b +c
}
add(1, 2, 3) // 6
add(1, 2, 3) // 6
0x005 使用babel翻译
function add(...num){
  return num.reduce((n1,n2)=>n1+n2)
}

翻译后

function add() {
  for (var _len = arguments.length, num = Array(_len), _key = 0; _key < _len; _key++) {
    num[_key] = arguments[_key];
  }

  return num.reduce(function (n1, n2) {
    return n1 + n2;
  });
}

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/99145.html

相关文章

  • es6基础0x007:展开

    摘要:概述展开符号真的是一个非常好用的东西,我常用于字符串分割数组合并数组拷贝对象合并对象拷贝。 0x000 概述 展开符号真的是一个非常好用的东西,我常用于字符串分割、数组合并、数组拷贝、对象合并、对象拷贝。 0x001 语法 ...iterableObj 0x002 函数调用的时候参数展开 这是在函数调用的时候,将参数展开,和剩余参数有区别,剩余参数是在函数声明中使用 myFunctio...

    RyanQ 评论0 收藏0
  • es6基础0x001:箭头函数

    摘要:这就是所谓的箭头函数不绑定,而在我看来,回调函数就是箭头函数最好的归宿。 0x000 概述 箭头函数有两个作用: 更简短的写法 不绑定this 0x001 语法一表览 ()=>{} ()=>{console.log(arrow);return null} ()=>hello (num1, num2)=>num1+num2 num=>++num ()=>({name:arrow})...

    stonezhu 评论0 收藏0
  • es6基础0x003:默认参数

    摘要:语法使用使用翻译一下传值检测从翻译的结果可以看出,默认参数只检查两种情况不传参数传入前参后用前面的参数可以作为后面参数的默认值,甚至可以对前面的参数做一些特别的操作,比如简单的加减乘除默认参数调用函数赋值默认参数甚至可以调用函数,可以调用函 0x000 语法 function [name]([param1[ = defaultValue1 ][, ..., paramN[ = defa...

    james 评论0 收藏0
  • es6基础0x012:Map

    摘要:概述也是一个新的数据结构,在中其实也经常用到,比如下面的栗子,我们经常这么使用一个对象,与其说他是对象,其实他更像一个,但是比起真正的,这个还是有点弱了,初始化初始化一个有一个可选的参数,该参数必须是一个可迭代对象,可迭代对象包括和用户定 0x000 概述 Map也是一个新的数据结构,在js中其实也经常用到,比如下面的栗子,我们经常这么使用一个对象,与其说他是对象,其实他更像一个Map...

    DesGemini 评论0 收藏0
  • es6基础0x021:反射

    摘要:概述反射说起来和上一章节的代理基本一样,只是使用的方式不同,设计理念也不同。 0x000 概述 反射说起来和上一章节的代理基本一样,只是使用的方式不同,设计理念也不同。 反射提供了一系列的静态函数,可以使用Reflect.function_name(...prams)调用,这一系列的方法和代理的处理器对象方法一致 0x001 apply 语法 Reflect.apply(targ...

    booster 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<