---
tags: JavaScript 實戰班, Day13
---

# 設計魔劍三組

## 6/24：Day 13

小美家無論是外觀或內部擺設都是一致的簡潔，如果一張椅子就足夠使用，家中絕不會出現第二張椅子，所以東西的數量都是剛剛好的狀態。看起來小美一個人在這邊住了一段時間，但小明的加入好像又剛剛好讓房子內有了第二份一樣，有了第二張椅子、第二張床、第二間房間、甚至是第二份餐點。

白吃白住的小明也常常感到疑惑，採買的食材明明只有一人份，小美卻能生出第二人份的餐點。這天，小明決定偷偷的看小美做了什麼事，讓小明也能一起享受這份美食。

小美將處理的食材細心排成一列，接下來列的另一個空間排好了牌子，碰的一聲！食材就變成了兩份。

小明！！

小美：不用偷偷看，這也是 ES6 的技巧

小明：你怎麼還沒教我

小美：因為一般人學會，會無視等價交換的法則

小明：那餐點一份變兩份，算等價交換嗎？

小美：不算

小明：...，那可以教我了嗎？

小美：可以

參考：

- 解構文章：[https://wcc723.github.io/javascript/2017/12/25/javascript-destructuring/](https://wcc723.github.io/javascript/2017/12/25/javascript-destructuring/)
- 解構 MDN：[https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment)

任務：

- 依據提示將以下程式碼用解構方式達成目標

// 請使用解構組合使 arr2 變成為 [1, 2, 3, 4, 5, 6] 的結果
var arr = [1, 2, 3];
var arr2 = [？, 4, 5, 6]; // [1, 2, 3, 4, 5, 6]
console.log(arr2);

// 請使用解構組合以下兩個陣列為 [1, 2, 3, 4, 5, 6] 的結果
var nums1 = [1, 2, 3];
var nums2 = [4, 5, 6];
var nums3 = ...
console.log(nums3);

// 請使用解構，取出 name 及 age 的變數
const person = {
  name: '小明',
  age: 16
}

// 請使用解構，將以下陣列分別取出為獨立變數 Ming, Auntie, Jay, Mei
var people = ['小明', '漂亮阿姨', '杰倫', '小美'];

---

### Ryan

var arr = [1, 2, 3];
var arr2 = [...arr, 4, 5, 6]; // [1, 2, 3, 4, 5, 6]
console.log(arr2);


var nums1 = [1, 2, 3];
var nums2 = [4, 5, 6];
var nums3 = [...nums1,...nums2]
console.log(nums3);


// 請使用解構，取出 name 及 age 的變數
let {name, age} = person;
console.log(name, age);


// 請使用解構，將以下陣列分別取出為獨立變數 Ming, Auntie, Jay, Mei
var people = ['小明', '漂亮阿姨', '杰倫', '小美'];
let [Ming, Auntie, Jay, Mei] = people;
console.log(Ming, Auntie, Jay, Mei);

> 助教回覆：作業做的很好哦，解構的很正確 :+1:
>

---

### ClareDes.

// 請使用解構組合使 arr2 變成為 [1, 2, 3, 4, 5, 6] 的結果
var arr = [1, 2, 3];
var arr2 = [...arr, 4, 5, 6]; // [1, 2, 3, 4, 5, 6]
console.log(arr2);

// 請使用解構組合以下兩個陣列為 [1, 2, 3, 4, 5, 6] 的結果
var nums1 = [1, 2, 3];
var nums2 = [4, 5, 6];
var nums3 = [...nums1,...nums2 ]
console.log(nums3);

// 請使用解構，取出 name 及 age 的變數
const person = {
  name: '小明',
  age: 16
}

let  {name, age } = person
console.log(name,age);

// 請使用解構，將以下陣列分別取出為獨立變數 Ming, Auntie, Jay, Mei
var people = ['小明', '漂亮阿姨', '杰倫', '小美'];
let [Ming, Auntie, Jay, Mei] = people;
console.log(Ming,Auntie,Jay,Mei);

> 助教回覆：作業做的很好哦，解構的很正確 :+1:
>

---

### Yoyo

// 1
var arr = [1, 2, 3];
arr2 = [...arr, 4, 5, 6];

console.log(arr2);

// 2
var nums1 = [1, 2, 3];
var nums2 = [4, 5, 6];
var nums3 = [...nums1, ...nums2];

console.log(nums3);

// 3
const person = {
  name: '小明',
  age: 16
}

let {name,age} = person;

console.log(name,age);

// 4
var people = ['小明', '漂亮阿姨', '杰倫', '小美'];
let [Ming,Auntie,Jay,Mei]=people;

console.log(Ming,Auntie,Jay,Mei);

> 助教回覆：