翻譯：瘋狂的技術宅
原文：https://github.com/Microsoft/TypeScript/wiki/What's-new-in-TypeScript

---

本文首發微信公眾號：jingchengyideng
歡迎關注，每天都給你推送新鮮的前端技術文章

---

改進了調用聯合類型的行為

在TypeScript的早期版本中，不同的聯合類型如果想互相訪問其取值，它們參數的取值列表必須完全一致才行。

type Fruit = "apple" | "orange"; type Color = "red" | "orange";type FruitEater = (fruit: Fruit) => number; // 吃水果并對它們排名 type ColorConsumer = (color: Color) => string; // 處理顏色并對其進行描述declare let f: FruitEater | ColorConsumer;// Cannot invoke an expression whose type lacks a call signature. // 無法調用這個表達式，因為缺少調用簽名類型。 // Type 'FruitEater | ColorConsumer' has no compatible call signatures.ts(2349) // 類型 'FruitEater | ColorConsumer' 沒有兼容的調用簽名.ts（2349） f("orange");

不管怎樣，在上面的例子中，FruitEater 和 ColorConsumer 都應該能夠接受字符串"orange"，并返回 number 或 string 類型才對。

在TypeScript 3.3中，下面這段代碼將不再會報錯。

type Fruit = "apple" | "orange"; type Color = "red" | "orange";type FruitEater = (fruit: Fruit) => number; // 吃水果并對它們排名 type ColorConsumer = (color: Color) => string; // 處理顏色并對其進行描述declare let f: FruitEater | ColorConsumer;f("orange"); // 可以正常工作！將返回一個'number | string'.f("apple"); // error - Argument of type '"red"' is not assignable to parameter of type '"orange"'.f("red"); // error - Argument of type '"red"' is not assignable to parameter of type '"orange"'.

在TypeScript 3.3中，這些參數會互相交織在一起然后創建新簽名。

在上面的例子中， fruit 和 color 的參數列表會被交叉到一起產生新的 Fruit＆Color 類型的參數。 Fruit & Color會處理為 ("apple" | "orange") & ("red" | "orange") ，它等同于("apple" & "red") | ("apple" & "orange") | ("orange" & "red") | ("orange" & "orange")。 那些不可能的組合被處理成 never，到最后留下了 "orange" & "orange" 這個組合，結果只能是 "orange"。

注意
當聯合中最多只有一個類型具有多個重載時，這種新行為才會出現，并且聯合中最多只能有一個類型具有通用簽名。 這意味著 number[] | string[]這種形式 ，在 map （通用）這樣的方法中仍然不可以調用。

另一方面，在 forEach 這樣的方法中現在可以調用，但是在 noImplicitAny 下可能存在一些問題。

interface Dog {kind: "dog"dogProp: any; } interface Cat {kind: "cat"catProp: any; }const catOrDogArray: Dog[] | Cat[] = [];catOrDogArray.forEach(animal => {// ~~~~~~ error!// 參數'animal'隱式含有'any'類型。 });

在TypeScript 3.3中，這仍然很嚴格，添加顯式類型注釋將解決這個問題。

interface Dog {kind: "dog"dogProp: any; } interface Cat {kind: "cat"catProp: any; }const catOrDogArray: Dog[] | Cat[] = []; catOrDogArray.forEach((animal: Dog | Cat) => {if (animal.kind === "dog") {animal.dogProp;// ...}else if (animal.kind === "cat") {animal.catProp;// ...} });

使用 --build --watch 檢查復合項目的增量文件

TypeScript 3.0 引入了一個用于構建過程的被稱為“復合項目”的新功能。 其目的之一是確保用戶可以將大型項目拆分為更小的部分，從而能夠快速構建，同時保留項目結構，而不會影響現有的 TypeScript 體驗。 正式因為有了復合項目，TypeScript 可以用 --build 模式僅重新編譯部分項目和依賴項集。 您可以把它視為對項目間構建的優化。

TypeScript 2.7還引入了 --watch 模式，通過新的增量“構建器”API進行構建。 該模式只重新檢查和傳送被修改的，可能會影響類型檢查的源碼文件和依賴。 您可以將其視為對項目內構建的優化。

在3.3版本之前，在使用 --build --watch 構建復合項目時，實際上并沒有使用這種監視增量文件的基礎結構。 在 --build --watch 模式下，如果一個項目中有了更新，將會強制完全重新構建該項目，而不是檢查項目中有哪些文件受到影響。

在TypeScript 3.3中， --build 模式的 --watch 標志也可以利用增量文件機制進行監視了。 這可能意味著在 --build --watch 模式下構建速度能將會更快。 在我們的測試中，此功能使--build --watch 的構建時間比原來縮短了50％到75％。 您可以閱讀與文件修改時的原始拉取請求相關的更多內容來查看這些數據，我們相信大多數使用復合項目的用戶將會在此處得到更好的體驗。

---

本文首發微信公眾號：jingchengyideng
歡迎關注，每天都給你推送新鮮的前端技術文章
關注后回復“體系”，檢查自己的前端知識體系是否完整

---

來源：https://segmentfault.com/a/1190000017997665

轉載于:https://www.cnblogs.com/qixidi/p/10406211.html

總結

以上是生活随笔為你收集整理的TypeScript 3.3来了！快看看有什么新功能的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。