譯者按： TypeScript 學(xué)習(xí)成本不高，項(xiàng)目切換成本不低，不過(guò)還是值得試一試的！
為了保證可讀性，本文采用意譯而非直譯。另外，本文版權(quán)歸原作者所有，翻譯僅用于學(xué)習(xí)。
自從 6 年前誕生，TypeScript 逐漸被各大型公司接受。 也許你有充足的理由說(shuō)服自己不要使用它，這些都讓你錯(cuò)失了 TypeScript。在這篇文章中，我會(huì)列舉大家為何不選用 TypeScript 的一些原因，比如學(xué)習(xí)曲線、工具、開(kāi)發(fā)效率、穩(wěn)定性以及對(duì)標(biāo)準(zhǔn)的兼容性。
首先需要強(qiáng)調(diào)一點(diǎn)：TypeScript 并不是一個(gè)完全嶄新的開(kāi)發(fā)語(yǔ)言。像 CoffeeScript 和 Reason 吸收了 Ruby 和 OCaml 的語(yǔ)法和語(yǔ)義融入到 JavaScript 語(yǔ)言中。TypeScript 從某種程度上說(shuō)，更加保守。
它只是在 JavaScript 的基礎(chǔ)上添加了類型系統(tǒng)(TypeScript 是 JavaScript 的超集)，所以它的學(xué)習(xí)曲線會(huì)相對(duì)平滑。特別是相對(duì)于完全切換到不同編程語(yǔ)言來(lái)說(shuō)。
下面是一段 TypeScript 代碼：
重慶分公司
重慶分公司
class Greeter {
greeting: string;
constructor(message: string) {
this.greeting = message;
}
greet() {
return "Hello, " + this.greeting;
}
}對(duì)比用 ES6 編寫的相同功能的代碼：
class Greeter {
constructor(message) {
this.greeting = message;
}
greet() {
return "Hello, " + this.greeting;
}
}正如 TypeScript 語(yǔ)言的一個(gè)設(shè)計(jì)者 Anders Hejlsberg 說(shuō)到：“如果你懂得 JavaScript，那么你就已經(jīng)懂得 TypeScript 了?！?稍后，我會(huì)介紹如何將現(xiàn)有的項(xiàng)目切換到 TypeScript 去。
當(dāng) TypeScript 在 2012 年誕生的時(shí)候就有了類和模塊的概念，標(biāo)準(zhǔn) JavaScript 直到 2015 年都還沒(méi)有！
今天，TypeScript 語(yǔ)言緊隨 ECMAScript 的定義，幾乎實(shí)現(xiàn)了Stage 3所有的提案。也就是說(shuō)，當(dāng)你在使用 TypeScript 的時(shí)候，你其實(shí)已經(jīng)在用最新的 JavaScript。而且感謝 ES3/ES5 編譯器，最終輸出的.js文件即使在舊版本的瀏覽器也不會(huì)出問(wèn)題。
如果你熟練使用腳本語(yǔ)言工作，你會(huì)喜歡它驚人的開(kāi)發(fā)效率。你可以在代碼中隨時(shí)修改數(shù)據(jù)結(jié)構(gòu)，而不必事先聲明。這種自由度，也伴隨著代價(jià)。這種動(dòng)態(tài)語(yǔ)言有了 bug 有時(shí)候很難搞定，它不會(huì)像靜態(tài)語(yǔ)言一樣，在編譯的時(shí)候有做類型的驗(yàn)證來(lái)保證代碼的正確性。
比如下面的 JavaScript 代碼：
function greeter(person) {
return "Hello, " + person.firstName + " " + person.lastName;
}通過(guò)代碼我們可以判斷 person 參數(shù)是一個(gè)對(duì)象，它有 firstName 和 lastName 兩個(gè)屬性。但是我們無(wú)法保證在運(yùn)行時(shí)一定是這樣。
特別是當(dāng)你的項(xiàng)目越大，和類型相關(guān)的 bug 就越可能觸發(fā)。
為了避免出現(xiàn)問(wèn)題，我們可以加上很多運(yùn)行時(shí)的驗(yàn)證，以及單元測(cè)試：
function greeter(person) {
if (!person || !person.firstName || !person.lastName) {
throw new Error("invalid arguments");
}
return "Hello, " + person.firstName + " " + person.lastName;
}
// Jasmine spec:
describe("greeter", function() {
it("returns greeting on valid input", function() {
expect(greeter({ firstName: "James", lastName: "Hetfield" })).toEqual(
"Hello, James Hetfield"
);
});
it("throws on invalid input", function() {
expect(() => greeter()).toThrowError("invalid arguments");
expect(() => greeter(5)).toThrowError("invalid arguments");
expect(() => greeter({ firstName: "Jason" })).toThrowError(
"invalid arguments"
);
});
});但是，這樣的實(shí)現(xiàn)方法很累贅，開(kāi)發(fā)者需要在每個(gè)函數(shù)前面都加上這樣的判斷來(lái)保證正確性。換個(gè)思路，如果我們給函數(shù)的參數(shù)加上類型，這個(gè)事情不就省去了么。
interface Person {
firstName: string;
lastName: string;
}
function greeter(person: Person) {
return "Hello, " + person.firstName + " " + person.lastName;
}
// Jasmine spec:
describe("greeter", function() {
it("returns greeting", function() {
expect(greeter({ firstName: "James", lastName: "Hetfield" })).toEqual(
"Hello, James Hetfield"
);
});
});上面的代碼更加簡(jiǎn)潔，甚至連測(cè)試也只需要考慮代碼的邏輯而不是數(shù)據(jù)的正確性。
TypeScript 有強(qiáng)大的類型系統(tǒng)來(lái)做類型推斷。你并不需要像在 C# 或則 Java 中那樣，顯示的列出數(shù)據(jù)的類型。下面是一個(gè)例子：
let user = { firstName: "James", lastName: "Hetfield" };
console.log(greeter(user));上面的代碼可以成功編譯。請(qǐng)注意我們并沒(méi)有聲明 user 是 Person 類型的。
TypeScript 編譯器并不會(huì)強(qiáng)制你必須在所有地方都聲明類型，你可以在正確性和效率上自己做一個(gè)權(quán)衡。你甚至可以在項(xiàng)目不同的區(qū)域自定義類型的嚴(yán)格程度。這樣的靈活性超出了以前所有的開(kāi)發(fā)語(yǔ)言。
沒(méi)有人可以確保哪種語(yǔ)言、工具或者框架一定可以持續(xù)活躍，特別是在前端這一領(lǐng)域。一個(gè)StackOverflow 博客的作者這樣寫道：
在 JavaScript 框架的使用有兩個(gè)明顯的階段。因?yàn)榭蚣艿牧餍惺紫扔幸粋€(gè)快速的上升期，然后當(dāng)開(kāi)發(fā)者接觸到其它新的技術(shù)后，慢慢的平穩(wěn)的下降。整個(gè)周期也就幾年的時(shí)間。
你本身處于一個(gè)快速迭代的行業(yè)，而你開(kāi)發(fā)的項(xiàng)目可以從某些特定的技術(shù)中受益。盡管 1、2 年后，你已經(jīng)切換到其它技術(shù)，但是你當(dāng)時(shí)學(xué)到的經(jīng)驗(yàn)依然值得。
TypeScript 由微軟在 2012 年發(fā)布，考慮到公司的形象以及其開(kāi)發(fā)平臺(tái)，很容易產(chǎn)生“只不過(guò)是給.Net 開(kāi)發(fā)者打造的一個(gè) JavaScript 開(kāi)發(fā)玩具而已”的想法。特別是當(dāng)時(shí)只有 Visual Studio 對(duì) TypeScript 有足夠的支持。事實(shí)上，TypeScript 的源代碼最開(kāi)始是發(fā)布在CodePlex上，一個(gè)微軟自己的 GitHub。
不過(guò)，現(xiàn)已不復(fù)當(dāng)年，TypeScript 身后的開(kāi)發(fā)團(tuán)隊(duì)意識(shí)到為了讓語(yǔ)言被廣泛接受，他們需要深入前端開(kāi)發(fā)社區(qū)，為開(kāi)發(fā)者提供高質(zhì)量的開(kāi)發(fā)工具并且接受反饋不斷改進(jìn)。他們不僅僅是把代碼公開(kāi)然后默默開(kāi)發(fā)，而是擁抱了一個(gè)開(kāi)放式開(kāi)發(fā)的方式。
在 2014 年，TypeScript 的源代碼移到了GitHub托管。而且整個(gè)開(kāi)發(fā)都在 GitHub 上公開(kāi)透明。他們同時(shí)接受外部提交貢獻(xiàn)，包括記錄 bug，提出建議以及提交 pull request。所有的 issue 會(huì)定期更新，幾天之內(nèi)就會(huì)有回應(yīng)。核心團(tuán)隊(duì)發(fā)布了語(yǔ)言的設(shè)計(jì)理念用來(lái)指導(dǎo)團(tuán)隊(duì)不偏離目標(biāo)并積極吸收社區(qū)的建議。他們有一個(gè)保持更新的roadmap(基本上每?jī)蓚€(gè)月發(fā)布一次更新)，并記錄重大的更新。
在我寫這篇文章的時(shí)候，所有主流的跨平臺(tái) IDE 或則編輯器像 Eclipse、Webstorm、Emacs、Vim、Sublime、Atom 和 VS Code 都對(duì) TypeScript 有著很好的支持，要么是內(nèi)置的，要么通過(guò)插件。為了和現(xiàn)有的庫(kù)和框架交互，核心團(tuán)隊(duì)花了很多時(shí)間來(lái)創(chuàng)建類型定義文件。另一個(gè)值得一提的是編譯器 API 的文檔非常完善，可以很好地構(gòu)建第三方工具。TypeScript 的開(kāi)發(fā)者團(tuán)隊(duì)也鼓勵(lì)開(kāi)發(fā)者在StackOverflow上提出技術(shù)問(wèn)題。
為了充分發(fā)揮 TypeScript 的優(yōu)勢(shì)，你需要花費(fèi)不少時(shí)間來(lái)聲明類型并修復(fù)編譯錯(cuò)誤，這會(huì)很繁瑣。TypeScript 的創(chuàng)建者們有考慮到原有 JavaScript 項(xiàng)目切換的問(wèn)題，提供了相應(yīng)的方案。
根據(jù)官方的遷移指導(dǎo)，你可以直接運(yùn)行 TypeScript 的編譯器。編譯器會(huì)拋出一些低層級(jí)的 bug，比如沒(méi)有 return 語(yǔ)句，代碼塊中有永遠(yuǎn)不會(huì)執(zhí)行的代碼。然后，你可以將.js 文件重命名為.ts 文件，然后再處理編譯結(jié)果。編譯器默認(rèn)的選項(xiàng)沒(méi)有特別嚴(yán)格，你可以開(kāi)啟更加嚴(yán)格的驗(yàn)證。整個(gè)遷移有一個(gè)底線：整個(gè)過(guò)程是相當(dāng)平滑的，它不會(huì)使開(kāi)發(fā)中斷。你可以選擇慢慢將一個(gè)項(xiàng)目切換到 TypeScript，或則來(lái)個(gè)快速的切換(參考:3 天搞定 60 萬(wàn)行代碼的遷移)。社區(qū)還有一個(gè)叫做TypeWiz的項(xiàng)目可以自動(dòng)給代碼添加類型信息。
為了和現(xiàn)有的 JavaScript 模塊無(wú)縫對(duì)接，TypeScript 支持類型聲明文件。舉個(gè)例子，如果你使用的庫(kù)中導(dǎo)出了一個(gè) camelize 的函數(shù)，你可以定義一個(gè)類型聲明文件并給出如下的定義：
declare function camelize(s: string): string;當(dāng)你導(dǎo)入類型聲明文件后，TypeScript 會(huì)正確獲取函數(shù)對(duì)應(yīng)的類型。
TypeScript 同時(shí)也發(fā)布了DefinitelyTyped，這個(gè) repository 包含了所有流行的庫(kù)的類型定義文件。在我寫這篇文章的時(shí)間點(diǎn)，DefinitelyTyped 已經(jīng)包含了超過(guò) 5000 個(gè) JavaScript 包的類型定義。使用方法非常簡(jiǎn)單：
npm install --save-dev @types/jasmine類型文件會(huì)自動(dòng)被編譯器包含，并且在編輯器中也會(huì)有對(duì)應(yīng)的代碼提示。幾乎所有或則大多數(shù)你使用的包都已經(jīng)有對(duì)應(yīng)的類型定義文件了，要么自身有相應(yīng)的類型定義文件，要么在 DefinitelyTyped 可以找到，你只需要下載安裝就好。Slack 的開(kāi)發(fā)團(tuán)隊(duì)分享了他們的經(jīng)驗(yàn)：
考慮到代碼維護(hù)，我們真的很感謝 TypeScript 強(qiáng)大的生態(tài)系統(tǒng)。我們是 React 和 Node/npm 的重度用戶，第三方庫(kù)也有對(duì)應(yīng)的類型文件極大方便了開(kāi)發(fā)。很多我們導(dǎo)入的庫(kù)已經(jīng)和 TypeScript 兼容。如果沒(méi)有，那么也可以在 DefinitelyTyped 找到。比如，React 并沒(méi)有自帶類型定義，你可以通過(guò)
npm install @types/react來(lái)安裝，無(wú)需其他額外操作。
使用靜態(tài)類型檢車可以幫助你消除很多 bug，對(duì)于一個(gè)基于 Node/JavaScript 的項(xiàng)目，TypeScript 是你最好的選擇。對(duì)于一個(gè)相對(duì)小或則試驗(yàn)性的項(xiàng)目，也許沒(méi)有必要。但是，一個(gè)大型的項(xiàng)目，TypeScript 絕對(duì)值得你嘗試。它帶來(lái)的好處遠(yuǎn)遠(yuǎn)大于它帶來(lái)的復(fù)雜度。一些大型的公司都開(kāi)始使用也是最好的證明，比如 Google、Slack、Asana、Ember 等等。希望這篇文章給你啟發(fā)，讓你重新燃起對(duì) TypeScript 嘗試的欲望。
Fundebug專注于JavaScript、微信小程序、微信小游戲、支付寶小程序、React Native、Node.js和Java實(shí)時(shí)BUG監(jiān)控。 自從2016年雙十一正式上線，F(xiàn)undebug累計(jì)處理了9億+錯(cuò)誤事件，得到了Google、360、金山軟件、百姓網(wǎng)等眾多知名用戶的認(rèn)可。歡迎免費(fèi)試用！
轉(zhuǎn)載時(shí)請(qǐng)注明作者Fundebug以及本文地址：
https://blog.fundebug.com/2018/12/26/7-bad-execuses-for-not-using-ts/
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無(wú)理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì)，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。
