【TypeScript 30】Day 2：物件型別

前一篇文章有提到型別的分類，也介紹了最基本的原始型別 Primitive Types：number, string, boolean, undefined, null等等的類型，緊接著就來介紹物件型別 Object Types。

物件型別 Object Types：*從原始型別或物件型別組合出來的複合型態*

其中包括了：

1. 基礎物件型別

2. TypeScript 擴充型別

3. 函式型別 Function Type

這篇會主題是基礎物件型別

首先一開始先測試看看一個簡單的物件，裡面包含了字串、數字以及布林等等不同的型別，像這樣。

型別推論

經過上一篇了解的型別推論，讀者可能會有幾種不同的答案，

1. info 被推論為 object

2. info 裡面的屬性被一一推論出型別

實際上 TypeScript 非常聰明的幫我們推論出各個屬性的型別。

聰明如你又會想說，那 Nullable Type 會被推論為 any 嗎 ?

竟然是 undefined 和 null!!!

那接下來我們一起來耍耍 TypeScript 吧 !!

設計幾種不同的情境：

1. 個別覆寫屬性值

看完昨天的文章大家應該都猜得到答案了吧，

沒錯，覆寫相同的型別可以正常執行，不過一但更改了一開始宣告好的型別後 TypeScript 就無情地拋出錯誤了。

1. 以物件型態覆寫屬性值

不同於第一種覆寫方式，這裡直接把建立新 object 並重新定義屬性值

TypeScript 厲害的地方來了，不僅幫我們監督型別了，甚至屬性都要完全符合一開始宣告的內容才可以

對於一開始直接 JS 這種弱型別語言的我更加了解強型別程式語言的嚴謹，以及事先規劃資料屬性的重要性，的確這樣一來就可以完完全全掌握住該物件的屬性以及方法，方法的部分後面會再提到。

1. 新增物件屬性值

這就有點像第一個情境加上第二個情境的多一個屬性值了，同樣的 TypeScript 不允許半路殺出一個屬性值出來。

基本的物件型別測試完後，來點複雜的物件包物件的情況。

型別註記

看完了object 的型別註記後，那有 object 的型別註記嗎 ?

當然有的， 我們拿上面的 blogs 的資料形式來當做例子：

比較令人意外的是，情境 1. 和 3.，這樣看起來和 Immutable 有著異曲同工之妙，如果有使用過 React 或 Redux 開發的讀者應該對 Immutable 不陌生( Vue or Angular 不太熟悉 ) ，簡單來說就是不能細部微調物件，而是直接修改整個物件。

小結：typeScript 中對於物件的型別推論與註記其實和原始型別一樣，不過有幾個點要特別注意，分別是 ( 1 ) 當使用推論時必須完全按照一開始定義好的物件型別與格式 ( 2 ) 當進行物件的型別註記時不能細微調整，而是把整個物件重新定義格式 ( Immutable ) 要改就改全部。