TypeScript 官网开宗明义 ——
TypeScript 是适用于任何规模应用的 JavaScript
其中奥妙,且看我一个边干边学的 JS 码农娓娓道来~
安装简单
因为 TypeScript 官方支持 ECMAScript 最新标准和进入 Stage 3 的提案,绝大多数项目的代码可以直接编译,polyfill 和运行时工具函数全内置,不像 Babel 那样需要自己找运行时补丁库或提案编译插件。
TypeScript
npm install typescript -D
Babel
npm install @babel/core @babel/preset-env @babel/cli -D
npm install @babel/polyfill
import '@babel/polyfill';
配置方便
TypeScript
TypeScript 默认不需要配置,在写 .ts(x)
文件的过程中,TS 编译器会在缺少配置的地方提示你需要添加什么配置,此时在项目根目录新建一个 tsconfig.json
文件,支持 TS 语言服务协议的代码编辑器还能提示配置文件的选项,全程按指导操作即可,官方文档都很少需要看~
Babel
Babel 虽然编译标准语法只需一个 preset 包,但更多的常用提案语法、框架语法糖就需要一大堆插件了,而且所有配置选项都没有代码提示,必须各种查文档,有时文档也不甚详细,容易踩坑……
{
"presets": ["@babel/preset-env"]
}
类型可选
TypeScript 的核心卖点是类型系统,这让很多从 JavaScript、PHP、Python 等脚本语言入门编程的程序员非常畏惧,认为是非常大的学习成本。
但 TS 的类型系统与 C/C++、Java、C# 等传统强类型语言从设计理念上非常不同 ——
TS 代码不需要处处声明类型,而只需程序员在编译器推导无效的少许地方标注类型
而 TS 类型推导的基础数据则是 JS、DOM、Node.js 等标准/技术中的 API 类型定义,编译器循着语法结构的上下文,自然能推导出大多数变/常量的类型,以便帮程序员检查潜在错误、显示代码提示。
开发轻松
Node.js 运行时
虽然 Node.js 创始人又另起炉灶搞了第一个全功能 TypeScript 运行时环境 Deno,但并不意味着 Node.js 不能方便地运行 TS 代码,因为我们有 ts-node
——
// 全局安装运行时
npm install ts-node -g
// 执行一个 TS 脚本
ts-node index.ts
Parcel 零配置打包
如果你用 Parcel 这种零配置打包器开发 Web 前端项目,你甚至完全不用安装包括 TypeScript、LESS、SCSS 在内的任何常见预编译语言的编译器。在项目首次启动时,Parcel 会自动帮你安装好项目依赖的所有代码文件类型对应的编译器!你只需在启动项目时装好 Parcel,然后就按 HTML、CSS、JS 原生语法写逻辑、引用外置资源即可 ——
npm install parcel-bundler -D
总结:TS,真香!
我的 JavaScript 生涯从 ES 3 入门,后来用 ES 5 结合 JSDoc 开发小框架,再到 ES 6+ 配合 ESDoc 开发 WebCell v1,最终用 TS + TSDoc 重写出 WebCell v2。在充分利用 JavaScript 这门“无所不能”的语言强大灵活性的同时,更简洁的 ECMAScript 新语法和更规范的 TypeScript 类型系统,为开源库和日常项目开发带来突飞猛进的效率提升 —— TS,真香!
而对于没有我这样渐进式平滑学习曲线的同学,我也有一个形象的比喻来打消你的顾虑 ——
没有类型推导的动态语言写起来好比关灯开夜车,老司机也怕掉沟里,何况新手?
TypeScript 这双氙气大灯,你确定不装?
彩蛋
再分享一个 TypeScript JSX 类型推导的新玩法:
CommanderJSX —— 用 JSX 声明命令行参数,并支持回调传参类型推导