TypeScript 2.0 Beta版 - 強大功能釋出!
今天我們很高興能告訴您 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
若對以上技術及產品有任何問題,很樂意為您服務! 請洽:台灣微軟開發工具服務窗口 – MSDNTW@microsoft.com / 02-3725-3888 #4922