作為一種在開(kāi)發(fā)人員中越來(lái)越受歡迎的編程語(yǔ)言，TypeScript 不斷發(fā)展，帶來(lái)了大量的改進(jìn)和新功能。在本文中，我們將深入研究 TypeScript 的最新迭代版本 5.0，并探索其最值得注意的更新。

1.裝飾器

TypeScript 5.0 引入了改進(jìn)的裝飾器系統(tǒng)，改進(jìn)了類型檢查和元數(shù)據(jù)生成。 裝飾器現(xiàn)在可以更無(wú)縫地與類型系統(tǒng)一起工作，使您能夠編寫(xiě)更清晰、更健壯的代碼。下面是方法裝飾器如何工作的一個(gè)簡(jiǎn)單示例：

在此示例中，@log 裝飾器會(huì)在每次調(diào)用方法時(shí)記錄方法名稱。除了方法裝飾器，TypeScript 5.0 還支持自動(dòng)訪問(wèn)器裝飾器、Getter 和 Setter 裝飾器等。

2. const 類型參數(shù)

在 TypeScript 5.0 之前，其推理通常會(huì)選擇更通用的類型，例如 將 ["Alice", "Bob", "Eve"] 推斷為 string[]，如果您想要更具體的類型，則必須為其添加 as const：

TypeScript 5.0 允許您將 const 修飾符添加到類型參數(shù)聲明中：

但請(qǐng)記住，const 修飾符僅影響在調(diào)用中編寫(xiě)的對(duì)象、數(shù)組和原始表達(dá)式的推斷，因此不會(huì)（或不能）用 as const 修改的參數(shù)將看不到任何 行為改變：

3. extends支持多配置文件

TypeScript 5.0 帶來(lái)了在 tsconfig.json 中擴(kuò)展多個(gè)配置文件的能力。此功能使跨項(xiàng)目共享和管理配置變得更加容易。以下是如何使用多個(gè)配置文件的示例：

在此示例中，配置文件擴(kuò)展了基本配置和玩笑配置，允許您根據(jù)需要組合和覆蓋設(shè)置。

4. 所有枚舉都是聯(lián)合枚舉

在 TypeScript 5.0 中，所有枚舉現(xiàn)在都被視為聯(lián)合枚舉。 聯(lián)合枚舉為使用枚舉值提供了更好的類型安全性和改進(jìn)的人體工程學(xué)。 這是一個(gè)例子：

TypeScript 5.0 通過(guò)為每個(gè)計(jì)算成員創(chuàng)建唯一類型，設(shè)法將所有枚舉變成聯(lián)合枚舉。這意味著現(xiàn)在可以縮小所有枚舉的范圍，并將其成員也作為類型引用。

5. — moduleResolution 捆綁器

TypeScript 5.0 引入了一種新的模塊解析策略，稱為 bundler。此策略旨在與 Webpack 和 Rollup 等捆綁器一起使用，從而實(shí)現(xiàn)更高效和簡(jiǎn)化的構(gòu)建過(guò)程（就像過(guò)去 Node.js 模塊中的任何相關(guān)導(dǎo)入一樣，需要包含文件擴(kuò)展名）。

要啟用 bundler 模塊解析策略，請(qǐng)?jiān)?tsconfig.json 中使用以下配置：

6.自定義分辨率標(biāo)志

TypeScript 5.0 添加了幾個(gè)新標(biāo)志來(lái)自定義模塊解析過(guò)程。這些標(biāo)志對(duì)如何解析模塊提供了更精細(xì)的控制，使您可以微調(diào)構(gòu)建過(guò)程。?

以下是簡(jiǎn)要概述：

• --allowImportingTsExtensions：允許導(dǎo)入帶有 TypeScript 特定擴(kuò)展名的 TypeScript 文件，例如 .ts、.mts 或 .tsx。

• --resolvePackageJsonExports：強(qiáng)制 TypeScript 在從 node_modules 中讀取包時(shí)查詢 package.json 文件的導(dǎo)出字段。

• --resolvePackageJsonImports：強(qiáng)制 TypeScript 在執(zhí)行以 # 開(kāi)頭的查找時(shí)查詢 package.json 文件的導(dǎo)入字段。

• --allowArbitraryExtensions：允許通過(guò)查找 {file basename}.d.{extension}.ts 形式的聲明文件來(lái)導(dǎo)入具有未知擴(kuò)展名的文件。

• --customConditions：獲取當(dāng) TypeScript 從 package.json 的導(dǎo)出或?qū)胱侄谓馕鰰r(shí)要考慮的附加條件列表。

7. — verbatimModuleSyntax

TypeScript 5.0 中新的 --verbatimModuleSyntax 標(biāo)志允許您在發(fā)出 JavaScript 代碼時(shí)保留原始模塊語(yǔ)法。 此功能在使用捆綁器時(shí)特別有用，因?yàn)樗恍枰~外的轉(zhuǎn)換。例如：

要啟用此標(biāo)志，請(qǐng)將其添加到您的 tsconfig.json 中：

8.支持?export?type*

TypeScript 5.0 引入了對(duì) export type * 語(yǔ)法的支持，它允許您從另一個(gè)模塊重新導(dǎo)出所有類型。?

此語(yǔ)法對(duì)于創(chuàng)建僅類型模塊或聚合來(lái)自多個(gè)來(lái)源的類型特別有用。?

這是一個(gè)例子：

在此示例中，使用 export type * 語(yǔ)法將 types.ts 模塊中的所有類型重新導(dǎo)出到 index.ts 模塊中。

9. JSDoc 中的@satisfies 支持

TypeScript 5.0 中新的@satisfies JSDoc 標(biāo)記使您能夠指定函數(shù)實(shí)現(xiàn)滿足特定接口。 在使用結(jié)構(gòu)類型或使用 TypeScript 對(duì) JavaScript 代碼進(jìn)行類型檢查時(shí)，此功能特別有用。?

這是一個(gè)例子：

在這個(gè)例子中，greeter 函數(shù)被標(biāo)記為@satisfies JSDoc 標(biāo)簽，表明它滿足 Greeter 接口。

10. JSDoc 中的@overload 支持

TypeScript 5.0 添加了對(duì) @overload JSDoc 標(biāo)記的支持，允許您在 JavaScript 代碼中為單個(gè)實(shí)現(xiàn)定義多個(gè)函數(shù)簽名。?

在處理需要支持多種參數(shù)類型或形狀的復(fù)雜函數(shù)時(shí)，此功能特別有用。?

這是一個(gè)例子：

在此示例中，add 函數(shù)標(biāo)有兩個(gè) @overload JSDoc 標(biāo)記，指定它可以處理數(shù)字和字符串作為參數(shù)。

11. 在 — build 下傳遞特定于發(fā)射的標(biāo)志

TypeScript 5.0 引入了在使用 --build 標(biāo)志時(shí)傳遞 emit-specific 標(biāo)志的能力。此功能允許您在構(gòu)建項(xiàng)目時(shí)微調(diào)項(xiàng)目的輸出，從而更好地控制構(gòu)建過(guò)程。部分消息：

• --declaration：從項(xiàng)目中的 TypeScript 和 JavaScript 文件生成 .d.ts 文件。

• --emitDeclarationOnly：只輸出 d.ts 文件，不輸出 JavaScript 文件。

• --declarationMap：為 d.ts 文件創(chuàng)建 sourcemaps。

• --sourceMap：為發(fā)出的 JavaScript 文件創(chuàng)建源映射文件。

• --inlineSourceMap：在發(fā)出的 JavaScript 中包含源映射文件。

12. 編輯器中不區(qū)分大小寫(xiě)的導(dǎo)入排序

TypeScript 5.0 通過(guò)不區(qū)分大小寫(xiě)改進(jìn)了編輯器中的導(dǎo)入排序。在組織導(dǎo)入時(shí)，此更改會(huì)導(dǎo)致更自然和直觀的排序順序，從而使代碼更清晰、更易讀。

13. 詳盡的開(kāi)關(guān)/外殼完成

TypeScript 5.0 通過(guò)提供詳盡的 switch/case 補(bǔ)全增強(qiáng)了代碼補(bǔ)全體驗(yàn)。 在處理聯(lián)合類型時(shí)，編輯器現(xiàn)在可以建議所有可能的情況，減少遺漏情況的機(jī)會(huì)，并使編寫(xiě)全面的 switch 語(yǔ)句變得更加容易。 這是一個(gè)例子：

14. 速度、內(nèi)存和包大小優(yōu)化

TypeScript 5.0 帶來(lái)了各種性能優(yōu)化，包括更快的類型檢查、更少的內(nèi)存使用和更小的包大小。這些改進(jìn)使使用 TypeScript 變得更加愉快，確保了流暢高效的開(kāi)發(fā)體驗(yàn)。

15.重大變更和棄用

與任何主要版本一樣，TypeScript 5.0 引入了一些重大更改和棄用。 在升級(jí)之前查看發(fā)行說(shuō)明并徹底測(cè)試您的項(xiàng)目至關(guān)重要。?

一些顯著的重大變化包括：

• 運(yùn)行時(shí)要求：TypeScript 現(xiàn)在以 ECMAScript 2018 為目標(biāo)。TypeScript 包還設(shè)置了最低預(yù)期引擎 12.20。對(duì)于 Node 用戶，這意味著 TypeScript 5.0 的最低版本要求至少為 Node.js 12.20 及更高版本。

• lib.d.ts 更改：更改 DOM 類型的生成方式可能會(huì)對(duì)現(xiàn)有代碼產(chǎn)生影響。值得注意的是，某些屬性已從數(shù)字轉(zhuǎn)換為數(shù)字文字類型，并且用于剪切、復(fù)制和粘貼事件處理的屬性和方法已跨接口移動(dòng)。

• API 重大更改：移至模塊，刪除了一些不必要的接口并進(jìn)行了一些正確性改進(jìn)。

• 關(guān)系運(yùn)算符中禁止的隱式強(qiáng)制轉(zhuǎn)換：

• Enum Overhaul：在 TypeScript 5.0 中你不會(huì)看到那些奇怪的 enum 問(wèn)題，這里有兩個(gè)重要的錯(cuò)誤改進(jìn)：

對(duì)構(gòu)造函數(shù)中的參數(shù)裝飾器進(jìn)行更準(zhǔn)確的類型檢查 — experimentalDecorators一些已棄用的配置和配置值。

以上就是TypeScript 5.0中重要的新功能，希望對(duì)你的工作學(xué)習(xí)有幫助。

千鋒數(shù)字智慧大前端——讓優(yōu)秀的教學(xué)資源不再孤芳自賞，與你共享！