---
# System prepended metadata

title: Day18 【牙起來】 物件、陣列 - Typescript

---

# Day18 【牙起來】 物件、陣列 - Typescript

## 非原始型別(object)

小寫的 `object` 指的是 **non-primitive**非原始型別
大寫的 `Object` 指的是實例(instance)


### 物件(Object) 

大括號`{}`表示物件
如果要加以型別的話會使用 `any`

`key`的寫法，需不需要單引號？

* 直接`裸key`，`key`名稱不能使用特殊符號
* 也可用單引號`'`把`key`包起來，較為嚴謹

兩者意義上完全相同，可擇一使用
但不能兩者同時出現，這樣會打架

![](https://i.imgur.com/PwfI4t9.png)


```typescript=
let a = {};

let b: any = {
    a: 10,
    'b': 'key可以是任何字',
    'c': true,
    '+-*/': "特殊符號",
}

console.log(a)  // {}
console.log(b.a)  // 10
console.log(b.b)  // key可以是任何字
console.log(b['c'])  // true
console.log(b['+-*/'])  // 特殊符號
```

* 可透過符號點`.` 取得物件底下的成員
* 也可透過字串索引來取得物件底下的成員


### 陣列(Array) 重複元素

有兩種方式可以代表陣列

* 可以使用 `Array<Type>`
* 可以寫成較為簡短的寫法 `Type[]`

這兩種寫法沒有任何差異，都是表示有多個重複的`Type`元素


```typescript=
let a : string[] = [];
let b : Array<string> = [];
let c : Array<string> = ['1', '2', '3', 'String'];

console.log(a);  // []
console.log(b);  // []
console.log(c);  // [ '1', '2', '3', 'String' ]
console.log(c[1]);  // 2
```

## 大腸包小腸

### 物件包陣列

物件內有陣列的情況

```typescript=
let a = {
    a: ['字', '字字', '字字字'],
    b: [123, '字字字字'],
};

console.log(a)  // { a: [ '字', '字字', '字字字' ], b: [ 123, '字字字字' ] }
console.log(a.a)  // [ '字', '字字', '字字字' ]
console.log(a.b[0])  // 123
```

### 物件包物件

```typescript=
let a = {
    a: {
        a: {
            a: '禁止套娃'
        }
    }
};

console.log(a)  // { a: { a: { a: '禁止套娃' } } }
console.log(a.a)  // { a: { a: '禁止套娃' } }
console.log(a['a']['a'])  // { a: '禁止套娃' }
console.log(a.a.a.a)  // 禁止套娃
```


### 陣列包陣列

```typescript=
let a = [
    [111, 222, 333],
    ['字']
];

console.log(a)  // [ [ 111, 222, 333 ], [ '字' ] ]
console.log(a[0])  // [ 111, 222, 333 ]
console.log(a[0][2])  // 333
console.log(a[1][0])  // 字
```

### 陣列包物件

陣列內有物件的情況
這時Typescript已無法推斷出陣列底下物件的型別

```typescript=
let a = [
    '123',
    { b: [456] }
];

console.log(a)
console.log(a[0])
console.log(a[1])
console.log(a[1]['b'])
```

