TypeScript 的演進(jìn)之路
TypeScript 是由微軟進(jìn)行開(kāi)發(fā)和維護(hù)的一門開(kāi)源的編程語(yǔ)言,它是 JavaScript 的嚴(yán)格語(yǔ)法超集,提供了可選的靜態(tài)類型檢查。本文將探索 TypeScript 的發(fā)展歷程、它對(duì) JavaScript 生態(tài)系統(tǒng)的影響,以及它如何成為開(kāi)發(fā)人員的必備工具。
發(fā)展歷程
2010:設(shè)計(jì)背景
TypeScript 的發(fā)展可以追溯到 2010 年, C# 和 Turbo Pascal 的創(chuàng)建者 Anders Hejlsberg 開(kāi)始思考如何改進(jìn) JavaScript 的開(kāi)發(fā)體驗(yàn)。在那個(gè)時(shí)候,JavaScript 還沒(méi)有成為主流的開(kāi)發(fā)語(yǔ)言,而且缺乏一些關(guān)鍵的特性,比如模塊化和類型系統(tǒng)。因此,Anders Hejlsberg 決定創(chuàng)建一種新的語(yǔ)言,它可以在保留 JavaScript 精髓的同時(shí),增加一些用來(lái)構(gòu)建大型應(yīng)用的特性。
圖片
在接下來(lái)的幾年里,微軟團(tuán)隊(duì)投入了大量的時(shí)間和精力來(lái)開(kāi)發(fā) TypeScript,并于 2012 年將其首次公開(kāi)發(fā)布。
2012:正式發(fā)布
TypeScript 于 2012 年 10 月正式發(fā)布。TypeScript 發(fā)布的最初動(dòng)機(jī)就是解決 JavaScript 的缺點(diǎn),處理復(fù)雜JavaScript代碼帶來(lái)的挑戰(zhàn)使他們需要自定義工具來(lái)簡(jiǎn)化組件開(kāi)發(fā)流程。
JavaScript 作為一種動(dòng)態(tài)類型的語(yǔ)言,由于缺乏類型檢查而容易出現(xiàn)運(yùn)行時(shí)錯(cuò)誤。TypeScript 旨在提供可選的靜態(tài)類型和面向?qū)ο蟮木幊坦δ?,使開(kāi)發(fā)人員更輕松地構(gòu)建和維護(hù)復(fù)雜的應(yīng)用。
function greet (name: string): string {
return "Hello, " + name;
}
由于 TypeScript 是 JavaScript 的嚴(yán)格超集,因此它保留了與現(xiàn)有 JavaScript 代碼的兼容性。TypeScript 編譯器 ( tsc) 將 TypeScript 代碼轉(zhuǎn)換為 JavaScript,使其可以在任何支持 JavaScript 的環(huán)境中運(yùn)行。這確保了開(kāi)發(fā)人員可以在項(xiàng)目中逐漸采用 TypeScript,而無(wú)需重寫(xiě)全部代碼。
在發(fā)布后不久,知名的開(kāi)源倡導(dǎo)者和開(kāi)發(fā)者 Miguel de Icaza 對(duì)這門語(yǔ)言表示認(rèn)可,但批評(píng)了其糟糕的 IDE 支持性,當(dāng)時(shí)僅有微軟的 Visual Studio IDE 支持其代碼,但此 IDE 當(dāng)時(shí)未在 Linux 和 OS X 操作系統(tǒng)上發(fā)布。
2012-2015:受到關(guān)注
TypeScript 早年在開(kāi)發(fā)者社區(qū)中的采用率穩(wěn)步增長(zhǎng)。2014 年 Angular 2 的發(fā)布標(biāo)志著 TypeScript 的一個(gè)重要里程碑,因?yàn)榱餍械那岸丝蚣苓x擇 TypeScript 作為其默認(rèn)語(yǔ)言。這一決定幫助 TypeScript 獲得了可信度,并引起了其他項(xiàng)目和組織的興趣增加。
圖片
在此期間,TypeScript 經(jīng)歷了數(shù)次重要的版本更新,引入了新功能和改進(jìn)語(yǔ)言特性。開(kāi)發(fā)者對(duì) TypeScript 的反響大多是積極的,他們認(rèn)識(shí)到 TypeScript 在類型安全、更好的工具支持和代碼可維護(hù)性方面帶來(lái)的價(jià)值。
interface Person {
firstName: string;
lastName: string;
}
function fullName(person: Person): string {
return person.firstName + " " + person.lastName;
}
let user = { firstName: "Jane", lastName: "Doe" };
console.log(fullName(user));
在這幾年中,有以下重要里程碑:
- 2013年發(fā)布的 TypeScript 0.9 增加了對(duì)泛型的支持。
- 2014年在微軟開(kāi)發(fā)者大會(huì)上發(fā)布 TypeScript 1.0。
- 2014年7月,開(kāi)發(fā)團(tuán)隊(duì)發(fā)布了全新的 TypeScript 編輯器,聲稱其性能提高了5倍。同時(shí),代碼托管由 CodePlex 遷移至 GitHub。
2015–2018:成為主流
隨著 TypeScript 越來(lái)越受歡迎,主要的庫(kù)和框架開(kāi)始為該語(yǔ)言提供一流的支持。React、Vue 和其他流行項(xiàng)目在其包中添加了 TypeScript 聲明,使開(kāi)發(fā)人員能夠從 TypeScript 的類型檢查和自動(dòng)完成功能中受益。這反過(guò)來(lái)又鼓勵(lì)更多的開(kāi)發(fā)人員在他們的項(xiàng)目中采用 TypeScript,創(chuàng)建了一個(gè)積極的反饋循環(huán),進(jìn)一步推動(dòng) TypeScript 的增長(zhǎng)。
圖片
在此期間,TypeScript 的類型系統(tǒng)也發(fā)生了重大改進(jìn),引入了聯(lián)合類型、交集類型和映射類型等功能。這些增強(qiáng)功能使開(kāi)發(fā)人員能夠表達(dá)復(fù)雜的類型關(guān)系,從而使 TypeScript 更加強(qiáng)大和靈活。
type Admin = {
role: "admin";
permissions: string[];
};
type User = {
role: "user";
username: string;
};
type SuperUser = Admin & User;
const superUser: SuperUser = {
role: "admin",
permissions: ["create", "read", "update", "delete"],
username: "superadmin", };
function getRole(user: Admin | User): string { return user.role; }
console.log(getRole(superUser));
2018-至今:逐漸成熟
近年來(lái),TypeScript 已經(jīng)成熟成為現(xiàn)代 Web 開(kāi)發(fā)的主要工具。由于它結(jié)合了類型安全性、改進(jìn)的工具以及與 JavaScript 生態(tài)系統(tǒng)的兼容性,該語(yǔ)言已在開(kāi)發(fā)人員和組織中廣泛采用。
微軟的 TypeScript 團(tuán)隊(duì)繼續(xù)迭代該語(yǔ)言,定期發(fā)布引入新功能和增強(qiáng)功能的版本。與此同時(shí),更廣泛的 JavaScript 社區(qū)已經(jīng)接受了 TypeScript,Next.js、NestJS 和 GraphQL 等流行項(xiàng)目提供了開(kāi)箱即用的一流 TypeScript 支持。
import React from "react";
import { GetServerSideProps } from "next";
import { useRouter } from "next/router";
interface PostProps {
title: string;
content: string;
}
export default function Post({ title, content }: PostProps) {
const router = useRouter();
// Anyone else hate this pattern?
if (router.isFallback) {
return <div>Loading...</div>;
}
// I can't wait for Suspense...
return (
<div>
<h1>{title}</h1>
<p>{content}</p>
</div>
);
}
export const getServerSideProps: GetServerSideProps<PostProps> = async (context) => {
const { id } = context.params;
const response = await fetch(`https://api.example.com/posts/${id}`);
const post = await response.json();
return {
props: {
title: post.title,
content: post.content,
},
};
};
重要里程碑
最后來(lái)看看 TypeScript 演變的時(shí)間線,重點(diǎn)介紹關(guān)鍵里程碑和在其發(fā)展中發(fā)揮重要作用的個(gè)人。
2010:初步發(fā)展
- Anders Hejlsberg 是 C# 和 Turbo Pascal 的創(chuàng)建者,領(lǐng)導(dǎo) Microsoft 的 TypeScript 項(xiàng)目,致力于語(yǔ)言和編譯器的研究。
2012:TypeScript 正式發(fā)布
- Microsoft 于 2012 年 10 月正式發(fā)布 TypeScript。
2013:TypeScript 0.9 發(fā)布
- 第一個(gè)公開(kāi)版本 TypeScript 0.9 引入了可選的靜態(tài)類型、泛型等功能。
2014:Angular 2 選擇 TypeScript
- Brad Green 和 Google 的 Angular 團(tuán)隊(duì)選擇 TypeScript 作為 Angular 2 的默認(rèn)語(yǔ)言。
- TypeScript 在開(kāi)發(fā)者社區(qū)中贏得了贊譽(yù)和關(guān)注。
- 2014年的微軟開(kāi)發(fā)者大會(huì)發(fā)布了 TypeScript 1.0。
- Visual Studio 2013 Update 2為TypeScript提供了原生支持。
- 2014年7月,開(kāi)發(fā)團(tuán)隊(duì)發(fā)布了新的TypeScript編輯器,聲稱其性能提高了5倍。同時(shí),代碼托管由CodePlex遷移至GitHub。
2015:TypeScript 1.5 發(fā)布
- TypeScript 1.5 發(fā)布,該版本引入了模塊別名、裝飾器和 ES6 風(fēng)格的生成器等新特性,并改進(jìn)了類型推斷和類型注解功能。
2016:TypeScript 2.0 發(fā)布
- TypeScript 2.0 發(fā)布,引入了不可空類型、控制流分析以及類型系統(tǒng)的其他增強(qiáng)功能。
- Daniel Rosenwasser 加入 Microsoft 的 TypeScript 團(tuán)隊(duì),為該語(yǔ)言做出貢獻(xiàn)并與社區(qū)互動(dòng)。
- Google 宣布將 TypeScript 作為 Angular 框架的官方語(yǔ)言。這一決定使得越來(lái)越多的開(kāi)發(fā)者開(kāi)始采用 TypeScript 來(lái)構(gòu)建他們的應(yīng)用程序。同時(shí),TypeScript 也開(kāi)始廣泛地應(yīng)用于其它的框架和庫(kù)中。
2017:React 和 Vue 的一流支持
- React 和 Vue 將 TypeScript 聲明添加到其包中,為 TypeScript 開(kāi)發(fā)人員提供一流的支持。
- Vue 的創(chuàng)建者尤雨溪成為 TypeScript 及其優(yōu)點(diǎn)的倡導(dǎo)者。
- TypeScript 2.5 發(fā)布,該版本引入了可選鏈?zhǔn)讲僮鞣?null 判斷符這兩個(gè)新特性,并對(duì) JSX 語(yǔ)法進(jìn)行了改進(jìn)和優(yōu)化。
2018:TypeScript 3.0 發(fā)布
- TypeScript 3.0 發(fā)布,該版本引入了許多新特性,例如提取元組類型、類型參數(shù)默認(rèn)推斷、未聲明屬性檢查等。此外,TypeScript 3.0 還提高了類型檢查的性能和準(zhǔn)確性。
- TypeScript 得到了開(kāi)發(fā)人員和組織的廣泛采用,成為現(xiàn)代 Web 開(kāi)發(fā)的主要內(nèi)容。
2019:TypeScript 3.7 發(fā)布
- TypeScript 3.7 發(fā)布,引入了可選鏈和空值合并,進(jìn)一步增強(qiáng)了語(yǔ)言的表達(dá)能力和安全性。
2020:TypeScript 4.0 發(fā)布
- Next.js、NestJS 和其他流行項(xiàng)目提供一流的開(kāi)箱即用的 TypeScript 支持。
- Next.js 的創(chuàng)建者 Guillermo Rauch 和 NestJS 的創(chuàng)建者 Kamil Mysliwiec 在項(xiàng)目中推廣 TypeScript 的使用。
- TypeScript 4.0 發(fā)布,該版本引入了諸多新特性,包括可變?cè)M類型、協(xié)變數(shù)組展開(kāi)、類屬性訪問(wèn)修飾符等。
2021–2023:持續(xù)增長(zhǎng)、逐漸成熟
- Microsoft 的 TypeScript 團(tuán)隊(duì)和更廣泛的 JavaScript 社區(qū)繼續(xù)改進(jìn)和迭代該語(yǔ)言。
- 對(duì)于處理復(fù)雜 Web 應(yīng)用的開(kāi)發(fā)人員來(lái)說(shuō),TypeScript 仍然是一種流行且必不可少的工具。
- TypeScript 5.0 發(fā)布,引入了裝飾器、速度內(nèi)存和包大小優(yōu)化等。
小結(jié)
從 2012 年問(wèn)世到目前成為開(kāi)發(fā)人員的必備工具,TypeScript 已經(jīng)走過(guò)了漫長(zhǎng)的道路。它與流行的庫(kù)和框架的集成、持續(xù)改進(jìn)和廣泛采用證明了它在生態(tài)系統(tǒng)中的價(jià)值。
如今,TypeScript 結(jié)合了類型安全、改進(jìn)的工具以及與 JavaScript 生態(tài)系統(tǒng)的兼容性,使其成為開(kāi)發(fā)復(fù)雜 Web 應(yīng)用的寶貴工具。