js笔记七:数组的解构与变参

数组的解构与函数变参

解构

es6新增了一个解构功能,如下所示

let [aa,bb,cc]= [1,2,3];
console.log(aa,bb,cc);
//显示为1   2   3

也就是将右边数组的元素依次赋值给左边数组列表中变量 .

• 也可以是已经定义好的变量

let aa,bb,cc;
[aa,bb,cc] = [1,2,3];

• 可跳过,一些变量

let [aa,,cc] = [1,2,3];

• 可少于变量数量

let [aa,bb,cc] = [1,2];   //cc===undefined;
//或let [aa,bb,cc] = [1,,3];  //bb===undefined;

• 也可以用于函数返回多值

function mmm(v) {
    if(v=== true) {
        return [true,1,2,3];
    }
    else{
        return [false];
    }
}
let [result,bb,cc,dd] = mmm(true);
if(result) {
    console.log(bb,cc,dd);
}

这个和lua的多值返回一样的效果.可以简化一些函数返回处理

变量 操作符…

对于函数变量,es2015增加了操作符…,实际上也是数组,大大简化了变参的操作.
对于参数名称,建议使用默认的args
- 常见使用

function sum(…args) {
    let r = 0;
    for(let i = 0; i < args.length; i++) {
        r += args[i];
    }
    return r;
}

• 再调变参函数

function printLog(…args) {
      console.log(…args);        //这一步大大简化了,如果是ES5那就头痛了.要用arguments,
}

• 还可以很轻松的扩展参数

function printLog(…args) {
      console.log("专有前缀",…args,"专有后缀");
}

• 因为…args是一个数组,也就是它可以用数组的方法操作.

function printLog(...args) {
    for(let i = 0; i < args.length; i++) {
        console.log(args[i]);
    }
    args.push("end");
    console.log(...args);
}

• 用…还可以将数组插入的新数组中去,

let u = [1,2,3];
let u1 = […u,4,5];
console.log(u1); //显示为[1,2,3,4,5];

后记

到此,所有数组和相关笔记就没有了,期待node.js能完整支持es6,省得用babel再编译了.再复杂的东西,都是由最简单的元素组成.如果忽视最简单的元素,就像javascript中的let,const,for,数组等,如果不能充分的理解和使用,你所的”高深代码”能好到哪里去呢?