Destructuring 解構賦值

解構賦值可以用在陣列或物件,可以提取特定的值成獨立變數。

Array Destructuring

1
2
3
4
5
6
7
8
9
10
const numbers = [1, 2, 3];
[num1, num2] = numbers;

console.log(num1, num2);

/*
Output:
1
2
*/

如果只想要提取 1 和 3 的值,只要在左邊陣列的中間部分空一格即可:

1
2
3
4
5
6
7
8
9
10
const numbers = [1, 2, 3];
const [num1, , num3] = numbers;

console.log(num1, num3);

/*
Output:
1
3
*/

也可以使用其餘運算子接下剩下的變數:

1
2
3
4
5
6
7
8
9
10
const numbers = [1, 2, 3];
const [num, ...nums] = numbers;

console.log(num, nums);

/*
Output:
1
[2, 3]
*/

Object Destructuring

1
2
3
4
5
6
7
let { name: n, age: a } = {
name: 'Blueberry',
age: 24
}

console.log(n); // Blueberry
console.log(a); // 24

物件解構賦值也同樣可以使用展開運算子:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
let { name, ...others } = {
name: 'Blueberry',
age: 24,
color: blue
}

console.log(name, others);

/*
Output: Blueberry
Object {
age: 24,
color: "blue"
}
*/
文章結束囉~

如果我的文章對你有幫助,可以幫我拍個手,感謝支持!