# 🏅 Day 4 - 陣列與物件
# TypeScript 物件
以下為使用物件的型別註釋寫法：
```tsx=
const person: {
name: string;
age: number;
greet: () => void;
} = {
name: "John",
age: 30,
greet: () => {
console.log(`Hello, my name is ${person.name}. I'm ${person.age} years old.`);
},
};
```
上面的程式碼中，我們建立了一個名為 `person` 的物件，它有 `name`、`age` 和 `greet` 三個屬性。
在 `person` 物件中定義了一個 `greet` 方法，通過後面使用點（`.`）運算子，來呼叫這個方法。用於打招呼並輸出名字和年齡。
## TypeScript 陣列
TypeScript 支援兩種宣告陣列的方式：
1. **使用方括號（[]）**
例如 **`number[]`** 表示數字型別的陣列。
2. **使用泛型陣列型別（Array<元素型別>）**
泛型提供一種方式來確保陣列中的所有元素都是同一種型別。例如，**`Array<number>`** 也表示數字型別的陣列。
### **範例程式碼**
**範例 1：數字型別陣列**
```tsx=
let numbers: number[] = [1, 2, 3, 4, 5];
console.log(numbers.length); // 輸出：5
```
**範例 2：字串型別的泛型陣列**
```tsx=
let fruits: Array<string> = ["蘋果", "香蕉", "櫻桃"];
fruits.push("西瓜");
console.log(fruits); // 輸出：["蘋果", "香蕉", "櫻桃", "西瓜"]
```
### **單選題**
1. **在 TypeScript 中，以下哪個是正確宣告數字陣列的方式？**
- A. **`let numbers = [1, 2, 3];`**
- B. **`let numbers: number[] = [1, 2, 3];`**
- C. **`let numbers: Array = [1, 2, 3];`**
- D. **`let numbers: [number] = [1, 2, 3];`**
2. **以下哪種方法可以用來向 TypeScript 陣列中添加新元素？**
- A. **`append()`**
- B. **`push()`**
- C. **`add()`**
- D. **`insert()`**
3. **如何宣告一個包含字串和數字的 TypeScript 陣列？**
- A. **`let values: [string, number] = ["Hello", 5];`**
- B. **`let values: (string | number)[] = ["Hello", 5];`**
- C. **`let values: Array<string, number> = ["Hello", 5];`**
- D. **`let values: string & number[] = ["Hello", 5];`**
4. **在 TypeScript 中，`pop()` 方法的用途是什麼？**
- A. 刪除陣列的第一個元素。
- B. 刪除陣列的最後一個元素。
- C. 在陣列的開頭添加一個元素。
- D. 在陣列的末尾添加一個元素。
5. **以下哪個是 TypeScript 中宣告多維陣列的正確方式？**
- A. **`let matrix: number[][] = [[1, 2], [3, 4]];`**
- B. **`let matrix: Array<number> = [[1, 2], [3, 4]];`**
- C. **`let matrix: number[] = [[1, 2], [3, 4]];`**
- D. **`let matrix: [number, number][] = [[1, 2], [3, 4]];`**
### **開發題目**
1. 寫一個 `calculateSum` 函式，該函式接受一個數字陣列作為參數並回傳它們的總和。
2. 寫一個 `findMaxValue` 函式，參數可以接受包含不同數字的數字陣列，並 return 找出其中的最大值。
3. 寫一個 `mergeArrays` 函式， 來合併兩個相同型別的字串陣列，並回傳一個包含兩個陣列所有元素的新陣列。
## 回報流程
將答案寫在 CodePen，並貼至底下回報就算完成了喔!
解答位置請參考下圖（需打開程式碼的部分觀看）
<!-- 解答：
單選題目：B、B、B、B、A
//第一題
function calculateSum(numbers: number[]): number {
return numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
}
// 第二題
function findMaxValue(numbers: number[]): number {
return Math.max(...numbers);
}
// 第三題
function mergeArrays(array1: string[], array2: string[]): string[] {
return [...array1, ...array2];
}
-->
回報區
---
| Discord | CodePen / 答案 |
|:-------------:|:----------------------------------------------------------------:|
|洧杰|[Codepen](https://codepen.io/hexschool/pen/poYgYqW?editors=1010)|
|連小艾|[Codepen](https://codepen.io/bolaslien/pen/XWGjRpQ?editors=1012)|
|RayChen#6088|[Codepen](https://codepen.io/raychen1996/pen/LYaRyjp)|
|hannahpun|[Codepen](https://codepen.io/hannahpun/pen/NWJrJWo)|
|YH.Lo|[Codepen](https://codepen.io/chloelo/pen/OJqRmOx)|
|ZS|[Codepen](https://codepen.io/irishuang/pen/xxBEdoV)|
|展誠|[Codepen](https://codepen.io/hedgehogkucc/pen/wvOzdQj?editors=1012)|
|Derrick|[Codepen](https://codepen.io/Derricktang/pen/MWxjogN?editors=0010)|
|77_0411|[Codepen](https://codepen.io/chung-chi/pen/xxBEdMZ?editors=1000)|
|YC|[HackMD](https://hackmd.io/SKoJd3EsTlitnjzCx4Rarg)|
|BonnieChan|[Codepen](https://codepen.io/Bonnie-chan-the-bold/pen/ZEPpybE)|
|苡安|[Codepen](https://codepen.io/yi-an-yang/pen/eYXdRBp)|
|JC|[Codepen](https://codepen.io/jcsamoyed/pen/NWJRgyZ?editors=0011)
|Kai|[Codepen](https://codepen.io/kaiyuncheng-the-styleful/pen/xxBELRz?editors=1111)
|銀光菇|[Codepen](https://codepen.io/genesynthesis/pen/poYEPpQ?editors=0012)|
|HsienLu|[CodePen](https://codepen.io/Hsienlu/pen/oNVzeRK)|
|rikku1756|[CodePen](https://codepen.io/rikkubook/pen/ZEPpXpm?editors=1011)|
|亞當|[CodePen](https://codepen.io/Adam-Hsu/pen/ZEPpyMp?editors=0011)|
|m_m|[CodePen](https://codepen.io/minnn7716/pen/qBvaVoP)|
|hiYifang|[HackMD](https://hackmd.io/@gPeowpvtQX2Om6AmD-s3xw/B1VlA0_uT)|
|Jack|[CodePen](https://codepen.io/lj787448952/pen/YzgGQVe)|
|神奇海螺|[CodePen](https://codepen.io/codemachine0121/pen/KKEgZMN?editors=1111)|
|chaya|[CodePen](https://codepen.io/vickyvvv9/pen/xxBEpLJ)|
|ethan1331|[CodePen](https://codepen.io/EthanTsai/pen/wvOzppG)|
|becca|[CodePen](https://codepen.io/beca323/pen/KKEgQwQ)|
|Bryan Chu|[CodePen](https://codepen.io/bryanchu10/pen/ExMgLPo)|
|Henry_Wu|[Codepen](https://codepen.io/hekman1122/pen/zYbKjYE?editors=1010) |
|NiuNiu|[CodePen](https://codepen.io/Dawson-the-bold/pen/yLwajzX?editors=0011)|
|jasperlu005|[Codepen](https://codepen.io/uzzakuyr-the-reactor/pen/MWxjXjq?editors=1111)|
|Starr|[CodePen](https://codepen.io/StarrZhong/pen/GRejGym)|
|Shaokang|[CodePen](https://codepen.io/tony-hsueh/pen/KKEgBKE)|
|wendy_.li|[HackMD](https://hackmd.io/PcmFgqZwRd-4Ep3-LgK5_Q)|
|LinaChen|[HackMD](https://codepen.io/LinaChen/pen/PoLGBdV)|
|deedee1215|[CodePen](https://codepen.io/diddy032/pen/poYEZLv)|
|Teddy|[CodePen](https://codepen.io/TaideLi/pen/WNmGavZ)|
|Zuo|[CodePen](https://codepen.io/linchinhsuan/pen/oNVzawX?editors=1011)|
|hannahTW|[CodePen](https://codepen.io/hangineer/pen/WNmGvKg?editors=1010)|
|薏慈|[CodePen](https://codepen.io/its_wang/pen/ZEPpMBy)|
|Otis|[CodePen](https://codepen.io/humming74/pen/bGZwmXj?editors=1011)|
|Mi|[CodePen](https://codepen.io/Mi-Jou-Hsieh/pen/LYaRBLL?editors=1011)|
|yunhung|[CodePen](https://codepen.io/ahung888/pen/qBvaLBo)|
|Yang|[CodePen](https://codepen.io/Yang-J/pen/JjzRwZe)|
|nina.kuo|[Codepen](https://codepen.io/ninakuo0814/pen/WNmGXPN)|
|Yee|[Codepen](https://codepen.io/alivealife/pen/YzgWmNb)|
|楓|[Codepen](https://codepen.io/maplestartend/pen/xxBRxBL)|
|精靈|[CodePen](https://codepen.io/justafairy/pen/rNRWVeq)|
|Judy ☻|[Codepen](https://codepen.io/hsiaohan/pen/wvOoBdB?editors=1011)|
|shan13|[Codepen](https://codepen.io/yishan13-tsai/pen/JjzbKrE)|
|bonnieli1414|[Codepen](https://codepen.io/bonnieli1414/pen/eYXBzxz?editors=1011)|
|leave3310|[Codepen](https://codepen.io/leave3310-the-looper/pen/PoLbOEB?editors=0011)|
|Lisa|[Codepen](https://codepen.io/lisaha/pen/KKENyoj?editors=1011)|
|wei|[CodePen](https://codepen.io/jweeei/pen/PoLGBZa)|
|皓皓|[HackMD](https://hackmd.io/@cutecat8110/rkU77vZYT)|
|Yao|[CodePen](https://codepen.io/AlbertoLL/pen/poYNMKN)|
|Alyce|[CodePen](https://codepen.io/alycehwy/pen/YzgNKGK?editors=0010)|
|四季春|[CodePen](https://codepen.io/KuoMin/pen/JjzEGbO?editors=1111)|
| 黃士桓 | [codePen](https://codepen.io/shr-huan-huang/pen/WNmRxNJ) |
| Alex-Chiu | [codePen](https://codepen.io/datsxzqg-the-selector/pen/bGZgRzO) |
|Amberhh | [codepen](https://codepen.io/Amberhh/pen/yLwgJLQ) |
| Rochel |[Codepen](https://codepen.io/rochelwang1205/pen/yLwgRLb?editors=1010)|
| clairechang |[Notion](https://claire-chang.notion.site/Day-4-62f0a647c5514886906a47043371d660)|
| erwin阿瀚 |[CodePen](https://codepen.io/yohey03518/pen/BabpXQM?editors=1010)|
| 小米 |[CodePen](https://codepen.io/joanne-wei/pen/mdoWdGB?editors=0012)|
| MCBB_4881 |[CodePen](https://codepen.io/ebvaxaah-the-bashful/pen/wvOJgBe?editors=0010)|
| fanshu0303 | [CodePen](https://codepen.io/JuiHsuanLee0303/pen/rNRygbK) |
|aki|[codepen](https://codepen.io/aki168/pen/wvOdegd)|
|Yoshi|[CodePen](https://codepen.io/yoshiyyc/pen/KKEqPJa)|
|Snorlax|[HackMD](https://hackmd.io/@snorlaxpock/H1cXfI5Y6)|
|Nick Lin|[HackMD](https://codepen.io/NickLinP/pen/vYPJpzx?editors=1111)|
| Han | [HACKMD](https://hackmd.io/@laihan/B18o2EaKa) |
| kevinhes | [CodePen](https://codepen.io/kevinhes/pen/ExMvBGe?editors=0011) |
| Jay | [CodePen](https://codepen.io/jayredk/pen/KKEXVQe?editors=0010) |
|zoe|[Codepen](https://codepen.io/Zoechiueh/pen/abMpmKE?editors=0011)|
|Eileen|[Codepen](https://codepen.io/Eileen-io/pen/MWxQWPK)|
|狸貓|[Codepen](https://codepen.io/tanuki320/pen/VwRxyNG?editors=0011)|
|阿鬥鬥|[HackMD](https://hackmd.io/@UI8LTgBERN6bVaxhFRS6gQ/BkQNAQ696)|
|Tori|[HackMD](https://hackmd.io/OAdkiOH-S_WkD-LF6IONVA?view)|
puffy#6803 | [CodePen](https://codepen.io/TernMayDay/pen/dyrrdEY?editors=0012)|
| 我是泇吟 | [CodePen](https://codepen.io/kljuqbxs/pen/wvLZQem) |
Sign in with Wallet
Connect another wallet