笔记：ES6新特性-参数收集和数组展开

参数的收集

通常定义一个函数，可传递多于参数个数的参数，但是多余的参数会被忽略。

function fn(a,b){
    console.log(a);
    console.log(b);
}

fn(1,2);//依次输出1,2

fn(1,2,3,4);//依次输出1,2,而多余的参数3,4被忽略

若要取得传入的多余参数，可使用JS内部对象：arguments

function fn(){
    for(var i = 0; i < arguments.length; i ++){
        console.log(arguments[i]);
    }
    console.log(arguments);//虽然arguments可以被遍历，但是arguments是个Object,不是数组，不能使用数组相关方法
    console.log(arguments instanceof Object);//true
    console.log(arguments instanceof Array);//false
}
fn(1,2,3,4);//1，2，3，4会被依次输出。

ES6中可以使用新的语法”…”(三个点)收集剩余参数。

function fn(a,b,...args){
    console.log(a);
    console.log(b);
    console.log(args);
    console.log(args instanceof Object);//true
    console.log(args instanceof Array);//true
}

fn(1,2,3,4);//依次输出1，2，多余参数3，4，会被封装到args中，作为数组输出

…args将剩余的参数封装成一个数组。
…args必须作为参数列表中的最后一个参数

数组的展开

语法：…(三个点)

function fn(a,b,c){
    console.log(a);
    console.log(b);
    console.log(c);
}

fn(1,2,3);//依次输出1,2,3

let arr = [4,5,6];

fn(...arr);//同fn(1,2,3),依次输出4，5，6
fn(arr);//注意比较，直接输出一个数组和两个undefind,因为b和c没有被赋值

数组前添加”…”，相当于将数组展开成N（N=数组长度）个单独的数组组成元素。

let arr = [1,2,3];
let brr = [4,5,6];

let crr = [arr,brr];//输出由数组组成的数组
console.log(crr);

let drr = [...arr,...brr];//数组arr,brr被展开
console.log(drr);//区别drr与crr的不同

实例

function fn(a,b,c,...args){
    console.log(a);
    console.log(b);
    console.log(c);
    console.log(args);
}
function fn1(...args){
    fn(...args);
}

fn1(1,2,3,4,5,6);
fn(1,2,3,4,5,6);//输出结果相同

小结：

1. 参数收集后，作为一个数组，要处理的话，还是需要循环遍历
2. java和python中有类似语法，所以不难理解。

参考：

根据开课吧《ECMAScript6.0》视频教程整理。