                        課程
                    
                        /前端開發(fā)
                        
                            /Typescript
                        
                        /TypeScript極速入門

聯(lián)合類型問題

老師您好：

聯(lián)合類型產(chǎn)生的新類型只會(huì)有共同擁有的屬性，例如下面代碼：

interface?EnglishCourse?{
????name:?string,
????desc:?string
}

interface?MathCourse?{
????name:?number,
????price:?number
}

//?聯(lián)合類型
type?Course2?=?EnglishCourse?|?MathCourse;

結(jié)果：聯(lián)合類型Course2打點(diǎn)只有name屬性

但是聯(lián)合類型還是可以聲明desc屬性，這是什么原因？

曉之蛇

2024-01-03

源自：TypeScript極速入門 3-1

關(guān)注問題我要回答

359

操作

收起

2 回答

黑石
2024-01-09

這是兩種安全策略的問題，分為類型匹配和屬性訪問限制。
類型匹配：在你的代碼中，變量 c2 被定義為 Course2 類型，這是 EnglishCourse | MathCourse 的聯(lián)合類型。變量 c2?的結(jié)構(gòu) { name: 'a', desc: 'abc' } 符合 EnglishCourse 接口的定義（因?yàn)?EnglishCourse 有 name 和 desc 兩個(gè)屬性），所以 TypeScript 認(rèn)為這是一個(gè)有效的賦值。

????????

接下來，關(guān)于為什么你不能直接訪問 c2.desc：

屬性訪問限制：盡管變量 c2 在定義時(shí)沒有報(bào)錯(cuò)，但當(dāng)你嘗試訪問 c2 的屬性時(shí)，TypeScript 變得更加嚴(yán)格。在使用聯(lián)合類型時(shí)，你只能訪問所有類型共有的屬性。由于 EnglishCourse 和 MathCourse 沒有共有的屬性（它們的 name 屬性類型不同），直接訪問 c2.desc 會(huì)導(dǎo)致錯(cuò)誤。這是因?yàn)樵诓淮_定 c2 究竟是哪個(gè)類型的情況下，直接訪問可能不存在的屬性是不安全的。

因此，雖然在定義變量時(shí) TypeScript 允許 c2 匹配 MathCourse 類型，但在后續(xù)訪問屬性時(shí)，由于 c2 可能是 EnglishCourse 或 MathCourse，直接訪問特定于其中一種類型的屬性（如 desc）會(huì)導(dǎo)致錯(cuò)誤。要安全地訪問這些屬性，你需要使用類型守衛(wèi)（如類型斷言或 in 關(guān)鍵字檢查）來確定 c2 的確切類型。

這兩個(gè)方面并不矛盾，而是反映了 TypeScript 在不同場(chǎng)景下的類型安全策略：一方面，在賦值時(shí)允許某種程度的靈活性；另一方面，訪問屬性時(shí)則需要更嚴(yán)格的類型確定性。