沐鳴登錄平台_TypeScript 漸進遷移指南

花了 10 個小時使用 console.log 排查問題后,你終於修復了 Cannot read property ‘x’ of undefined 問題,出現這個問題的原因是調用了可能為 undefined 的某個方法,給了你一個「驚喜」!你暗暗發誓,一定要把整個項目遷移到 TypeScript。但是看了看 lib、util、components 文件夾里上萬個 JavaScript 文件,你對自己說:「等以後吧,等我有空的時候。」當然那一天永遠也不會到來,因為總有各種酷炫的新特性等着加到應用,客戶也不會因為項目是用 TypeScript 寫的就出大價錢。,遷移一個包含成千上百個文件的大型項目可能比你想象得要容易。整個過程主要分 3 步。,我在大概一年前寫了一篇如何把 Node.js 項目從 JavaScript 遷移到 TypeScript 的指南。指南的閱讀量超過了七千,不過其實當時我對 JavaScript 和 TypeScript 的了解並不深入,把重心更多地放到特定工具上,而沒怎麼從全局着手。最大的問題是我沒有提供遷移
大型項目的解決方案。顯然,大型項目不可能在短時間內重寫一切。因此,我很想分享下我最近學到的遷移項目到 TypeScript 的主要經驗。,添加神奇的 d.ts,const user = {
id:
1234,
firstname:
‘Bruce’,
lastname:
‘Wayne’,
status:
‘online’, };
const users = [user];
const onlineUsers = users.filter(
(u) => u.status ===
‘online’);
console.log( onlineUsers.map(
(ou) =>
`${ou.firstname} ${ou.lastname} is ${ou.status}`) );,連接類型,function sendMessage(from, to, message),d.ts 是 TypeScript 的類型聲明文件,其中聲明了代碼中用到的對象和函數的各種類型,不包含任何具體的實現。,如果我告訴你,你可以
增量遷移到 TypeScript 並
立刻從中受益呢?,export
interface User { id:
number; firstname:
string; lastname:
string; status:
‘online’ |
‘offline’; },注意:本文假定你已經有一定的 TypeScript 基礎,同時使用 Visual Studio Code,否則,一些地方可能不一定直接適用。,相關代碼:https://github.com/,
,花了 10 個小時使用 console.log 排查問題后,你終於修復了 Cannot read property ‘x’ of undefined 問題,出現這個問題的原因是調用了可能為 undefined 的某個方法,給了你一個「驚喜」!你暗暗發誓,一定要把整個項目遷移到 TypeScript。但是看了看 lib、util、components 文件夾里上萬個 JavaScript 文件,你對自己說:「等以後吧,等我有空的時候。」當然那一天永遠也不會到來,因為總有各種酷炫的新特性等着加到應用,客戶也不會因為項目是用 TypeScript 寫的就出大價錢。