ES6

ES6学习笔记2:变量的解构赋值数组篇

Posted by mieruko on 2016-12-05

前言

变量的解构赋值。
一个使多变量赋值变得更加简单的东西。
它有很多形式,这篇博客是对数组形式做一个记录。

变量的解构赋值之基本用法

以前如果你想要给几个变量同时赋值,你这样做:

1
2
3
var a = 1;
var b = 2;
var c = 3;

简化后:

1
var a = 1, b = 2, c = 3;

但是在ES6中,你还可以这样搞:

1
var [a, b, c] = [1, 2, 3];

你还可以随便往里面加括号:

1
var [a, [b, c]] = [1, [2, 3]];

这样也没问题。

变量的解构赋值之一堆小🌰

挑着赋值

如果你只想赋值a,c而此时却只有一个三个元素的数组,你还可以这样:

1
var [a, , c] = [1, 2, 3];

挑着赋值,嘻嘻。

多元素赋值

有时候我们希望把剩下的一堆元素全部赋值给一个变量。

1
2
3
var [a, ...c] = [1, 2, 3];
console.log("a:", a);
console.log("c:", c);

这段程序输出的c是一个数组[2, 3]。
c会自动把里面的元素组成一个数组。

存在默认值

有时候我们会见到默认值存在的情况。比如:

1
2
3
4
5
var [a, b, c="default", d="default"] = [1, 2, 3];
console.log("a:",a);
console.log("b:",b);
console.log("c:",c);
console.log("d:",d);

输出结果是d:default;
虽然等号右边的元素并不够,但是d还是顺利输出了。

解构赋值的好处

很明显,我们的代码变得简单了,用更少的信息量,表达了我们想表达的东西。
所以解构赋值大法好呀!^_^