摘要：他們的計(jì)劃是，使用微軟開(kāi)發(fā)者們所習(xí)慣的其他語(yǔ)言的開(kāi)發(fā)工具所支持的靜態(tài)類(lèi)型，得到更好的代碼。在微軟內(nèi)部，被和以及團(tuán)隊(duì)所使用，而且它被系的等公司使用。標(biāo)準(zhǔn)的編輯，同時(shí)也是微軟項(xiàng)目高級(jí)經(jīng)理的也同意。

本文轉(zhuǎn)載自：眾成翻譯
譯者：文藺
鏈接：http://www.zcfy.cc/article/895
原文：http://thenewstack.io/javascript-transpilers-need-know/

想要在與 ECMAScript 保持一致的同時(shí)也不拋棄那些沒(méi)有最新 JavaScript 特性的瀏覽器嗎？或者在成為標(biāo)磚之前試驗(yàn)?zāi)切┘磳⒌絹?lái)的特性，以告訴 ECMAScript 哪些對(duì)你有用，哪些沒(méi)什么用？再或者就是想利用那些大型項(xiàng)目中提高 JavaScript 效率的工具？轉(zhuǎn)譯器（transpiler）可以幫你完成所有這些。

轉(zhuǎn)譯器是將一種語(yǔ)言的代碼轉(zhuǎn)換為另一種語(yǔ)言代碼的工具，它們過(guò)去曾被更多地用來(lái)轉(zhuǎn)換替代性語(yǔ)言如 CoffeeScript、ClojureScript、Elm，甚至還使用像 C 和 C++、Emscripten（將 LLVM 二進(jìn)制碼轉(zhuǎn)換為 asm.js 代碼） 這樣的語(yǔ)言。Mozilla 的政策與研究主任 Dave Herman 指出，這并不是要替代 JavaScript，“多種 Web 編程模型可以愉快地共存，它們甚至還能健康地競(jìng)爭(zhēng)、相互借鑒?！?/p> 擴(kuò)展 JavaScript

與此類(lèi)似，他評(píng)論 TypeScript、PureScript、Flow 以及 JSX 這樣一些給 JavaScript 增加自定義擴(kuò)展的轉(zhuǎn)譯器“對(duì) Web 來(lái)說(shuō)是偉大的”。

TypeScript 是 JavaScript 的超集，支持可選的靜態(tài)類(lèi)型，還有一些工具，它們提高代碼編寫(xiě)效率，支持重構(gòu)，還可以偵測(cè)錯(cuò)誤，從方法名的書(shū)寫(xiě)錯(cuò)誤到因類(lèi)型錯(cuò)誤而無(wú)法執(zhí)行的操作都能被檢測(cè)到。你可以試驗(yàn)帶有類(lèi)型安全特性但同時(shí)保持可讀性的 JavaScript，而不用深陷在其他語(yǔ)言如 Dart 或 CoffeeScript 之中。

當(dāng)初，使用 TypeScript 來(lái)編寫(xiě) Babylon.js 的時(shí)候，David Catuhe 指出來(lái)，“使用 Babylon.js 的開(kāi)發(fā)者不會(huì)察覺(jué)到 TypeScript 編寫(xiě)的新版本與 JavaScript 編寫(xiě)的老版本之間的差異?！彼€提到，引入 TypeScript 幫助他找到了許多之前在代碼中一直存在的小 bug。

使用轉(zhuǎn)譯器，意味著開(kāi)發(fā)者在編碼的時(shí)候可以使用更新的特性和 API，總的說(shuō)來(lái)，這同時(shí)也會(huì)幫助社區(qū)發(fā)展。 —— Henry Zhu

對(duì)那些大量編碼大團(tuán)隊(duì)來(lái)說(shuō)，這些好處能帶來(lái)巨大的效率提升。這正是 2011 年 TypeScript 啟動(dòng)時(shí)，微軟所尋求的。Office Online 網(wǎng)頁(yè)應(yīng)用擁有超過(guò) 100 萬(wàn)行的代碼，“那時(shí)候做這樣的 app，可沒(méi)那么多可以使用的工具”，TypeScript 前任項(xiàng)目經(jīng)理 Jonathan Turner 告訴我們。他們的計(jì)劃是，使用微軟開(kāi)發(fā)者們所習(xí)慣的其他語(yǔ)言的開(kāi)發(fā)工具所支持的靜態(tài)類(lèi)型，得到更好的 JavaScript 代碼。

VS Code 和 Visual Studio 很好地支持 TypeScript，也有 Sublime、Emacs 和 Vim 的 TypeScript 插件，還有其他一大堆工具正在支持。TypeScript 被許多項(xiàng)目選中，比如說(shuō)，Angular，Asana，Dojo，Mozilla 的 Flash 替代產(chǎn)品，以及 Babylon.js WebGL 框架、JavaScript 遠(yuǎn)程調(diào)試工具 vorlon.js。

在微軟內(nèi)部，TypeScript 被 Bing、 Visual Studio 和 Visual Studio Online、Azure 以及 Xbox 團(tuán)隊(duì)所使用，而且它被 Adobe、Google、Palantir、Progress（NativeScript）、eBay 系的 SitePen 等公司使用。

除了擴(kuò)展 JavaScript，TypeScript 還可以將代碼轉(zhuǎn)譯為匹配多種 ECMAScript 標(biāo)準(zhǔn)的代碼，這讓你可以出更少的力氣支持多種瀏覽器，還能提前使用 ECMAScript 標(biāo)準(zhǔn)的建議。

這個(gè)特點(diǎn)也被開(kāi)源的 Babel transpiler 所支持，這是另一個(gè) JavaScript 轉(zhuǎn)譯器。

“轉(zhuǎn)譯器允許開(kāi)發(fā)者編寫(xiě)面向未來(lái)的代碼，哪怕當(dāng)前版本的語(yǔ)言不被任何環(huán)境支持，” Babel 核心團(tuán)隊(duì)的 Henry Zhu 解釋道?！氨确秸f(shuō)，如果你要支持不含任何 ES2015 特性的 IE 瀏覽器，那就必須要轉(zhuǎn)譯了，因?yàn)?IE 對(duì)新語(yǔ)法一無(wú)所知。Babel 就是中間的一層，讓你無(wú)需考慮正在使用什么瀏覽器、指定哪些需要轉(zhuǎn)譯的特性。瀏覽器實(shí)現(xiàn)規(guī)范需要時(shí)間，他們?cè)谠隽窟M(jìn)行。如果沒(méi)有自動(dòng)更新特性，可能用戶(hù)永遠(yuǎn)不會(huì)更新 JavaScript 版本，所以唯一的辦法就是編寫(xiě)新版本的 JavaScript 然后再轉(zhuǎn)譯?！?/p>

和 TypeScript 一樣，Babel 不僅僅是轉(zhuǎn)譯，Zhu 提到?！癇abel 是 JavaScript 轉(zhuǎn)換通用性工具。它并不只是將 ES6 轉(zhuǎn)到 ES5?！?Babel 擁有超過(guò) 1000 個(gè)的擴(kuò)展插件；“人們?yōu)樘囟ǖ膸?kù)、工具（如代碼檢測(cè)）、瀏覽器優(yōu)以及代碼壓縮等編寫(xiě)插件?！?/p> Standards at Scale

此外，Zhu 說(shuō)，“使用轉(zhuǎn)譯器，意味著開(kāi)發(fā)者在編碼的時(shí)候可以使用更新的特性和 API，總的說(shuō)來(lái)，這同時(shí)也會(huì)幫助社區(qū)發(fā)展?！?/p>

“規(guī)范的創(chuàng)造者們?cè)?TC-39 處理的 stage-0 到 stage-4 過(guò)程中（譯者注：原文 “TC-39 stage process from stage-0 to stage-4”，可以流程可以參考譯文《ES7新特性及ECMAScript標(biāo)準(zhǔn)的制定流程》）可以接收到提案的反饋，如果有人為其編寫(xiě)了插件，” Zhu 說(shuō)道。“因?yàn)橛袕V泛的用戶(hù)基礎(chǔ)，Babel 允許許多用戶(hù)嘗試實(shí)驗(yàn)特性，相對(duì)于只是被沒(méi)有‘真實(shí)世界’測(cè)試的語(yǔ)言作者所認(rèn)可，這有助于塑造更好的特性。許多提議都在 Github 上，任何人都可以給未來(lái)的提案提供建議，只要它還在往前發(fā)展?！?/p>

Herman 對(duì)他所謂的 “標(biāo)準(zhǔn)轉(zhuǎn)譯技術(shù)的采用，特別是 Babel 的成功” 充滿(mǎn)熱情?！皩?duì)開(kāi)發(fā)者來(lái)說(shuō)，最現(xiàn)實(shí)的誘惑就是利用 JavaScript 的改進(jìn)之處，哪怕引擎（瀏覽器或 Node.js）尚未提供原生支持。不過(guò)因?yàn)檫@些特性是基于標(biāo)準(zhǔn)的，開(kāi)發(fā)者們可以放心大膽地使用，而不必?fù)?dān)心大的兼容性變化。在快速進(jìn)化的 JavaScript 生態(tài)系統(tǒng)中，這對(duì)開(kāi)發(fā)者的價(jià)值，怎么說(shuō)都不為過(guò)?！?/p>

ECMAScript 標(biāo)準(zhǔn)的編輯，同時(shí)也是微軟 Edge 項(xiàng)目高級(jí)經(jīng)理的 Brian Terlson 也同意?！稗D(zhuǎn)譯器十分重要。JavaScript 程序員通常都想使用最新特性。迎合最小公分母是很悲催的，沒(méi)人想做這事。轉(zhuǎn)譯器讓我們得以直接使用新語(yǔ)法，這你所鐘愛(ài)的、提高你效率的、讓你的應(yīng)用更具維護(hù)性的語(yǔ)法 —— 然后將其編譯為可以在那些老頑固的瀏覽器上跑起來(lái)的東西，你希望市場(chǎng)上再也不要有這些老頑固了，可不幸的是它們還在。轉(zhuǎn)譯器在 JavaScript 社區(qū)如何書(shū)寫(xiě)代碼這方面起到了變革性的作用?！?/p>

開(kāi)發(fā)人員早期的使用和反饋，帶來(lái)了良性循環(huán)，Herman 說(shuō)?！稗D(zhuǎn)譯器已經(jīng)引發(fā)了新特性的超前使用與社區(qū)實(shí)驗(yàn)的浪潮。這讓開(kāi)發(fā)者們有能力在真實(shí)的生產(chǎn)環(huán)境中的應(yīng)用里面使用新特性，并且對(duì)更新到最新版本特性的頻度和時(shí)間有了控制。這也就意味著更多的開(kāi)發(fā)者正在參與標(biāo)準(zhǔn)特性的早期審查，使他們?cè)谧兓倪^(guò)程中有了更強(qiáng)的聲音，最終帶來(lái)更好的標(biāo)準(zhǔn)?！?/p>

“多虧有了轉(zhuǎn)譯器，未來(lái)版本的特性正在持續(xù)獲得大量的早期試用。（比如）裝飾器（Decorators）讓類(lèi)定義中抽象通用模式（pattern）成為可能，它在 Web 框架如 Angular、Ember 及 React 中大受歡迎，” Herman 說(shuō)道。Ember.js 社區(qū)很早就采用了 Babel，Herman 說(shuō)這讓許關(guān)于模塊系統(tǒng)（module system）的多可用性反饋進(jìn)入到 ES 2015 中。

開(kāi)發(fā)者的反饋也推動(dòng)了裝飾器的標(biāo)準(zhǔn)化，Terlson 說(shuō)。“早期在轉(zhuǎn)譯器中實(shí)現(xiàn)的特性真的是很大的、引人注目的特性，像裝飾器就是這樣；這對(duì)那些特性設(shè)計(jì)的迭代非常有幫助?！?/p>

“如果你所知道的某個(gè)特性真的能改善你的代碼和你所工作的應(yīng)用，” 他建議，“趕緊在轉(zhuǎn)譯器中做起來(lái)或使用 polyfill，用起來(lái)，然后給我們反饋。”

轉(zhuǎn)譯器是解決新特性無(wú)法進(jìn)入 ES 標(biāo)準(zhǔn)除非其已被實(shí)現(xiàn)的雞生蛋還是蛋生雞的問(wèn)題的一種辦法。不過(guò)瀏覽器廠商們不太愿意實(shí)現(xiàn)尚未標(biāo)準(zhǔn)化的特性，因?yàn)檫@可能導(dǎo)致開(kāi)發(fā)者們無(wú)法與特性的標(biāo)準(zhǔn)保持一致，這些特性在標(biāo)準(zhǔn)化的過(guò)程中會(huì)有所變化。

ES 2015 不需要之前的實(shí)現(xiàn)；“結(jié)果就是，” Terlson 解釋道，“在我們批準(zhǔn)某些特性如 Proxy 之后，實(shí)現(xiàn)者們遇到了標(biāo)準(zhǔn)中沒(méi)有體現(xiàn)的東西，所以在現(xiàn)實(shí)面前，我們不得不做修改。這體現(xiàn)出在批準(zhǔn)那些標(biāo)準(zhǔn)之前確保特性將按照標(biāo)準(zhǔn)實(shí)現(xiàn)有多重要。”類(lèi)似問(wèn)題還有尾調(diào)用優(yōu)化，這并非巧合，Zhu 提到了那些無(wú)法在轉(zhuǎn)譯器中嘗試的特性。

在新版本語(yǔ)言出爐之前，語(yǔ)言的維護(hù)者需要程序員們提供反饋。Terlson 認(rèn)為，轉(zhuǎn)譯器就是其中重要的一部分?！稗D(zhuǎn)譯器幫助我們得到語(yǔ)法上的反饋。擁有 Babel 和 TypeScript 這些轉(zhuǎn)譯器，我們真的很幸運(yùn)，這讓我們?cè)跒g覽器實(shí)現(xiàn)之前就能使用試驗(yàn)新語(yǔ)法。對(duì)某些特性來(lái)說(shuō)，我們相當(dāng)自信，如果有轉(zhuǎn)譯器 或 polyfill 外加瀏覽器，它們將會(huì)工作?！?/p>

轉(zhuǎn)譯器能比瀏覽器更快地開(kāi)發(fā)新特性， Herman 指出，“Babel 由 JavaScript 實(shí)現(xiàn)，而瀏覽器們是用 C++ 實(shí)現(xiàn)的，所以功能更容易做出來(lái)。一些特性要同整個(gè)瀏覽器整合起來(lái)，可能是更棘手的挑戰(zhàn)。JavaScript 引擎都有復(fù)雜的、多層 JIT 編譯的構(gòu)架，這常常意味著僅僅一個(gè)特性需要多次實(shí)現(xiàn)，每層實(shí)現(xiàn)一次。而且相比實(shí)現(xiàn)新的 JavaScript 特性，瀏覽器引擎開(kāi)發(fā)團(tuán)隊(duì)的責(zé)任更多，所以他們要衡量?jī)?yōu)先級(jí)?！?/p>

轉(zhuǎn)譯器不可能給你提供所有新特性，Herman 指出，“某些特性，如 ES 2015 的 Proxy，或者當(dāng)前的 SharedArrayBuffer 提議，基本上不可能通過(guò)轉(zhuǎn)譯器來(lái)實(shí)現(xiàn)。其他的，像 ES 2015 的 Symbol，可以部分實(shí)現(xiàn)，不過(guò)有一些已知的局限。這一類(lèi)的問(wèn)題，需要開(kāi)發(fā)者們多注意，他們必須確保不會(huì)依賴(lài)那些轉(zhuǎn)譯器無(wú)法正確實(shí)現(xiàn)的行為。”

隨著 ECMAScript 標(biāo)準(zhǔn)的發(fā)展，轉(zhuǎn)譯器也不會(huì)將你同 JavaScript 的變化隔離開(kāi)來(lái)?！靶枰岢鲆稽c(diǎn)警告，” Terson 提到，“我們會(huì)聽(tīng)取使用轉(zhuǎn)譯器特性的開(kāi)發(fā)者的反饋，有可能標(biāo)準(zhǔn)會(huì)因此變更。針對(duì)標(biāo)準(zhǔn)，在其完成之前，我們可能做出重大改變，所以當(dāng)你使用超前于標(biāo)準(zhǔn)的特性時(shí)，我們會(huì)提出警告?！?/p>

即便如此，它們能幫助你過(guò)渡，Herman 說(shuō)?！爱?dāng)升級(jí)轉(zhuǎn)譯器新版本的時(shí)機(jī)到來(lái)，讓其因?qū)嶒?yàn)語(yǔ)言特性不兼容的改變而打破你的代碼，這會(huì)很麻煩而且耗時(shí)不少。因此，像 Babel 這樣的轉(zhuǎn)譯器允許你設(shè)置對(duì)不穩(wěn)定性的容忍度，不過(guò)你還需要應(yīng)對(duì)更多的流失。另外，你可以采取更加深思熟慮的設(shè)置，以降低不兼容的變化帶來(lái)的風(fēng)險(xiǎn)，同時(shí)限制自己在更小的穩(wěn)定的語(yǔ)言特性集中?！?/p>