TypeScript 2.0 Beta版 － 強大功能釋出！

  • Article

今天我們很高興能告訴您 TypeScript 2.0 的 beta 版釋出了！如果您還對 TypeScript 不熟悉的話，您今天就可以開始在我們的網站上學習。

要怎麼取得 beta 版呢？您可以下載 TypeScript 2.0 Beta for Visual Studio 2015（需要 VS 2015 Update 3），或直接執行

 npm install -g typescript@beta

這個版本包含了很多新的功能，就像是我們對於 .d .ts 檔案新的工作流程，以下我們就來看看有哪些新功能吧！

 

不可為 null 的類型

null 和 undefined 是兩個在 JavaScript 中最常見的錯誤來源。在沒有 TypeScript 2.0 之前，null 和 undefined 是存在於每一種類型，意思是說如果您有一個函式要取得一個 string，您不能光從類型確定您實際上取得的是 string 還是 null。

在 TypeScript 2.0 中，新的 --strictNullChecks 旗標改成讓 string 就是指 string，而 number 就是指 number。

 let foo: string = null; // Error!

那如果您想要讓某個東西可以是 null 呢？我們有兩種新的類型來面對這種情況：null 和 undefined。就如同您所想像的，null 就只能包含 null，而 undefined 只能包含 undefined。雖然它們本身並不怎麼實用，但是您可以用一個聯集類型來使用它們，描述有些東西可以是 null/undefined。

 let foo: string | null = null; // Okay!

因為通常您可能比類型系統還了解情況，所以我們也引進了一個後置的 ! 運算子，讓 null 和 undefined 從類型中排除掉。

 declare let strs: string[] | undefined;

// Error! 'strs' is possibly undefined.
let upperCased = strs.map(s => s.toUpperCase());

// 'strs!' means we're sure it can't be 'undefined', so we can call 'map' on it.
let lowerCased = strs!.map(s => s.toLowerCase());

 

類型的控制流程分析

TypeScript 能夠支援處理可為 null 的類型，是多虧了程式中類型被追蹤方式的改變。在 2.0 版本中，我們開始使用控制流程分析，來知道某個位置是什麼類型。

 /**
 * @param recipients  An array of recipients, or a comma-separated list of recipients.
 * @param body        Primary content of the message.
 */
function sendMessage(recipients: string | string[], body: string) {
    if (typeof recipients === "string") {
        recipients = recipients.split(",");
    }

    // TypeScript knows that 'recipients' is a 'string[]' here.
    recipients = recipients.filter(isValidAddress);
    for (let r of recipients) {
        // ...
    }
}

請注意，在經過 if 的區塊之後，TypeScript 就知道它必須處理一個 string 的陣列。這樣就可以在早期發現問題，並節省您 debug 的時間。

 let bestItem: Item;
for (let item of items) {
    if (item.id === 42) bestItem = item;
}

// Error! 'bestItem' might not have been initialized if 'items' was empty.
let itemName = bestItem.name;

我們欠 Ivo Gabe de Wolff 一個很大的感謝，他對於這個功能的貢獻與實作，是從他的論文開始的，也成為了 TypeScript 的一部份。

 

更簡單的模組宣告

有時候您只想要告訴 TypeScript 有一個模組，但並不在乎它長得怎樣。您可能有寫過類似下面這樣的東西：

 declare module "foo" {
    var x: any;
    export = x;
}

但這還蠻麻煩的，所以我們讓它更容易一點，並擺脫了樣板。在 TypeScript 2.0 您可以只要寫：

 declare module "foo";
declare module "bar";

當您準備好要勾勒出模組的樣子，可以回到這些宣告並定義您所需要的結構。
那如果您需要一個套件包含很多模組呢？一個個模組寫出來太麻煩了，TypeScript 2.0 讓這件事變得很簡單，只需要使用萬用字元在這些宣告就好了！

 declare module "foo/*";

現在您可以匯入任何路徑，只要開頭是 foo/ TypeScript 都會假設它存在。您可以利用這點，如果您的模組加載器也了解如何根據某些格式匯入。例如：

 declare module "*!text" {
    const content: string;
    export = content;
}

現在只要您匯入一個結尾是 !text 的路徑，TypeScript 就會了解這個匯入的類型是 string。

 import text = require("./hello.txt!text");
text.toLowerCase();

 

下一步

您可能會想知道的一個功能是，在 ES3 和 ES5 中 async 函式的支援。本來這個功能有在 2.0 的版本被提名，可是要合理地實作 async/await，我們需要重寫 TypeScript 的 emitter 作為一系列樹的轉換。這樣做同時要維持 TypeScript 的快速，需要很多工作與對於細節的注意。雖然我們對於今天的實作有信心，但是自信是比不上徹底的測試，而且需要更多時間來讓 async/await 穩定。您可以在 TypeScript 2.1 中期待這個功能，如果您想要追蹤我們的進度，目前在 GitHub 有開放提取要求。

TypeScript 2.0 還是包含了很多有用的新功能，而我們也將會持續推出更多細節。如果您很好奇有哪些新功能，您可以看一下我們的 wiki。在未來的幾週，更穩定的版本也將會釋出，而離最終產品也不遠了囉！

我們很樂意聽到任何您的意見與回饋，無論是在下面的評論或是在 GitHub 上。Happy hacking！

 

本文翻譯自 Announcing TypeScript 2.0 Beta

 

VS     typescript

若對以上技術及產品有任何問題，很樂意為您服務! 請洽：台灣微軟開發工具服務窗口 – MSDNTW@microsoft.com / 02-3725-3888 #4922