TypeScript 初学者指南：从零到精通 - 第一部分

第 1 部分：TypeScript 入门

为什么选择 TypeScript？

让我们面对现实：JavaScript 非常灵活 — 几乎过于灵活。虽然这让它使用起来很有趣，但也为隐蔽的运行时错误打开了大门，这些错误可能会导致您的应用程序意外中断。

这时，JavaScript 的超集 TypeScript 便能发挥作用了。它引入了静态类型，使代码更易于调试、扩展和维护。可以将 TypeScript 视为项目的安全网。

主要优点：

早期错误检测：在开发期间而不是运行时捕获错误。

代码可读性：帮助队友更好地理解您的代码。

可扩展性：让处理大型代码库变得轻而易举。

准备好你的环境

要编写和运行 TypeScript，我们需要一些工具。别担心 - 这就像煮早晨的咖啡一样简单。

1.安装Node.js和npm

下载并安装最新的 Node.js 版本。npm（Node 包管理器）与 Node.js 捆绑在一起。

验证安装：

node -v
npm -v

2.安装 TypeScript 编译器

打开终端并运行：

npm install -g typescript

验证安装：

tsc -v

3. 建立新项目

创建一个项目文件夹并导航到其中：

mkdir my-typescript-project
cd my-typescript-project

4.初始化项目

生成一个 `tsconfig.json` 文件，用于配置你的 TypeScript 编译器：

tsc --init

这将创建一个默认配置文件。您可以随着项目的发展对其进行调整。

你的第一个 TypeScript 程序

让我们编写一个将两个数字相加的简单程序。

创建一个名为“index.ts”的文件：

function add(a: number, b: number): number {
    return a + b;
}

console.log(add(5, 10)); // Output: 15

编译文件：

tsc index.ts

这将生成一个 JavaScript 文件（`index.js`）。

运行编译后的文件：

node index.js

恭喜，您刚刚编写并执行了第一个 TypeScript 代码！🎉

刚刚发生了什么？

:number 注释确保参数 a 和 b 是数字，并且函数返回一个数字。

如果将数字以外的任何内容传递给 add()，TypeScript 将引发编译时错误。

尝试一下：

console.log(add("5", 10)); 
// Error: Argument of type 'string' is not assignable to parameter of type 'number'.

TypeScript 的工作原理

类型检查：TypeScript 分析您的代码是否存在潜在的类型不匹配。

编译：TypeScript 将您的 .ts 文件转换为适用于浏览器的 .js 文件。

下一步

您已经了解了 TypeScript 的皮毛。在下一部分中，我们将深入探讨类型注释，您将学习如何使用类型描述变量、函数和数据结构。

CLIS.CC