LOGO OA教程 ERP教程 模切知识交流 PMS教程 CRM教程 开发文档 其他文档  
 
网站管理员

面向初学者的TypeScript指南

admin
2026年1月1日 11:27 本文热度 382

整个TypeScript官方文档分为这么一些模块:

  1. 快速开始

  2. 手册

  3. 参考文档

  4. 模块参考

  5. 教程

  6. 更新内容

  7. 声明文件

  8. JavaScript

  9. 项目

原文链接:https://www.typescriptlang.org/docs/handbook/typescript-from-scratch.html

文档位置:快速开始

翻译:谢杰

审校:谢杰


恭喜你选择 TypeScript 作为入门语言之一 —— 你已经迈出了正确的一步!

你可能已经听说过,TypeScript 是 JavaScript 的一种“变体”或“风格”。在现代编程语言中,TypeScript(TS)与 JavaScript(JS)之间的关系相当独特,了解这种关系有助于你理解 TypeScript 是如何在 JavaScript 的基础上进行扩展的。


什么是JavaScript?简要历史回顾

JavaScript(也被称为 ECMAScript)最初是一种为浏览器设计的简单脚本语言。它诞生之初,被期望用于网页中的小段代码片段 —— 编写超过几十行代码在当时是比较少见的。因此,早期的网页浏览器对这类代码的执行速度相当缓慢。

不过,随着时间推移,JS 越来越受欢迎,网页开发者开始使用它来创建交互体验。为了应对 JS 使用量的增加,浏览器厂商开始优化其执行引擎(如动态编译),并扩展 JS 的功能(添加各种 API),反过来又促使开发者更多地使用它。

在现代网站中,浏览器运行的应用程序往往包含几十万行代码。这种发展体现了 Web 的逐步演进:从最初的静态页面网络,成长为一个支持各类复杂应用的平台。

不仅如此,JS 的流行程度已超越浏览器本身,例如通过 node.js 来实现 JS 服务器。JS 的“随处运行”特性,使其成为跨平台开发的理想选择。如今,很多开发者甚至使用 JavaScript 来构建整个技术栈!

总的来说,JavaScript 是一门最初为快速使用而设计的语言,后来逐渐发展成为可以编写百万行应用程序的完整工具。每种语言都有自己的怪癖 —— 一些奇特和令人意外的行为,而 JavaScript 谦逊的起点也使它具备了不少这样的特点。以下是一些例子:

JavaScript 的相等运算符(==)会对操作数进行类型转换,可能导致意想不到的结果:

if ("" == 0) {  // 成立!但为什么??}if (1 < x < 3) {  // 对于任何x值都成立!}

JavaScript 还允许访问并不存在的属性:

const obj = { width10height15 };// 为什么是NaN?拼写错误真难发现!const area = obj.width * obj.heigth;

大多数编程语言在遇到这类错误时都会抛出异常,有些甚至会在编译阶段 —— 代码运行前 —— 就提示错误。在编写小型程序时,这些“怪癖”虽然恼人,但尚能应对;可是在开发数百上千行的大型应用时,这些不断出现的意外就会变成严重的问题。


TypeScript:静态类型检查器

前文提到,一些语言会直接阻止有问题的程序运行。这种在代码未运行前就发现错误的机制称为静态检查(static checking)。而基于操作值的类型来判断某段代码是否有误的过程,被称为静态类型检查(static type checking)。

TypeScript 会在程序执行前对其进行错误检查,并且依据值的类型来判断是否存在问题,因此它是一个静态类型检查器。比如,上文中的示例就因为 obj 的类型问题导致了一个错误。下面是 TypeScript 检查出的错误信息:

const obj = { width10height15 };const area = obj.width * obj.heigth;// 属性“heigth”在类型“{ width: number; height: number; }”上不存在。你是想写“height”吗?

JavaScript的类型超集

那么,TypeScript 与 JavaScript 之间到底是什么关系呢?

语法

TypeScript 是 JavaScript 的超集,因此 JavaScript 的语法在 TypeScript 中也是合法的。语法指的是我们书写程序时所使用的结构和规则。例如,下面的代码存在语法错误,因为少了一个右括号:

let a = (4// ')' expected.

TypeScript 不会因为 JavaScript 的语法本身而将其判定为错误。这意味着你可以把任意一段有效的 JavaScript 代码直接放入 TypeScript 文件中,而不必担心书写方式是否符合某种额外要求。

类型

不过,TypeScript 是一个带有类型系统的超集,这意味着它在 JavaScript 的基础上增加了关于不同类型值如何使用的规则。前面提到的 obj.heigth 错误,并不是语法错误,而是因为以错误的方式使用了某种类型的值 —— 这是一个类型错误。

再举一个例子,下面这段 JavaScript 代码在浏览器中可以正常运行,并会打印一个值:

console.log(4 / []);

这段语法合法的程序会输出 Infinity。但在 TypeScript 中,数字除以数组被认为是一种不合逻辑的操作,因此会报错:

console.log(4 / []);// 算术操作的右侧必须是类型为 'any''number''bigint' 或枚举类型。

也许你确实是故意想用数字除以数组,只是为了看看会发生什么;但大多数情况下,这其实是一个程序错误。TypeScript 的类型检查器旨在尽可能捕捉常见错误,同时确保正确的程序可以正常通过。(后文会介绍一些配置项,可用于控制 TypeScript 检查代码的严格程度。)

当你把某段代码从 JavaScript 文件迁移到 TypeScript 文件时,可能会看到一些类型错误,具体取决于代码的写法。这些错误有可能是代码中真实存在的问题,也可能是 TypeScript 出于保守考虑而给出的提示。在本指南中,我们将演示如何通过添加各种 TypeScript 语法来消除这些错误。

运行时行为

TypeScript 也是一门在运行时行为上与 JavaScript 保持一致的编程语言。例如,在 JavaScript 中,除以零会返回 Infinity,而不会抛出运行时异常。作为一项原则,TypeScript 绝不会改变 JavaScript 代码的运行时行为。

这意味着,当你将代码从 JavaScript 移动到 TypeScript 时,即使 TypeScript 认为这段代码存在类型错误,它的运行方式也一定是相同的。

保持与 JavaScript 一致的运行时行为,是 TypeScript 的一项核心承诺,因为它确保了你可以在两种语言之间轻松迁移,而不必担心某些细微差异会导致程序无法正常运行。

类型擦除

大致来说,当 TypeScript 编译器完成对代码的类型检查后,它会擦除所有类型信息,生成最终的“编译后”代码。这意味着,编译生成的 JavaScript 代码中不包含任何类型信息。

这也意味着,TypeScript 绝不会根据推断出的类型来改变程序的行为。总结来说,即使你在编译阶段看到了类型错误,类型系统本身对程序的运行方式没有任何影响。

最后,TypeScript 也不提供任何额外的运行时库。你的程序仍然使用 JavaScript 的标准库(或外部库),因此不需要学习任何专属于 TypeScript 的运行时框架。


学习JavaScript与TypeScript

我们经常会看到有人问:“我应该先学 JavaScript 还是 TypeScript?”

答案是:你不可能在不学习 JavaScript 的情况下学会 TypeScript!TypeScript与JavaScript拥有相同的语法和运行时行为,因此你在学习JavaScript的同时,其实也在学习TypeScript。

市面上有大量适合程序员学习 JavaScript 的资源;如果你在使用 TypeScript,也不应忽视这些资源。例如,StackOverflow 上被标记为 javascript 的问题数量大约是 typescript 的 20 倍,而这些 JavaScript 问题同样适用于 TypeScript。

如果你在搜索类似“TypeScript 中如何排序列表”这样的问题,请记住:TypeScript 就是带有编译时类型检查器的 JavaScript 运行时环境。在 TypeScript 中排序列表的方式,和在 JavaScript 中是一样的。当然,如果你能找到使用 TypeScript 的教程资源当然很好,但也不必限制自己只能找 TypeScript 专属的答案 —— 对于日常的运行时任务,JavaScript 的资料完全适用。


译者解读:

这是TypeScript官方文档的第一篇文章,总的来讲,介绍了TypeScript与JavaScript之间的关系,以及TypeScript有什么样的特点。

了解这些特点,是一个不错的开始!


阅读原文:原文链接


该文章在 2026/1/4 10:38:43 编辑过
关键字查询
相关文章
正在查询...
点晴ERP是一款针对中小制造业的专业生产管理软件系统,系统成熟度和易用性得到了国内大量中小企业的青睐。
点晴PMS码头管理系统主要针对港口码头集装箱与散货日常运作、调度、堆场、车队、财务费用、相关报表等业务管理,结合码头的业务特点,围绕调度、堆场作业而开发的。集技术的先进性、管理的有效性于一体,是物流码头及其他港口类企业的高效ERP管理信息系统。
点晴WMS仓储管理系统提供了货物产品管理,销售管理,采购管理,仓储管理,仓库管理,保质期管理,货位管理,库位管理,生产管理,WMS管理系统,标签打印,条形码,二维码管理,批号管理软件。
点晴免费OA是一款软件和通用服务都免费,不限功能、不限时间、不限用户的免费OA协同办公管理系统。
Copyright 2010-2026 ClickSun All Rights Reserved