后端开发教程 - Java、Spring Boot 实战 - msg200.com
从 JavaScript 迁移到 TypeScript
介绍
我从事 JavaScript 开发多年，从未想过要突破自己的技术栈。我告诉自己，坚持学习已有的知识会更安全，尝试学习太多编程语言可能会让人望而生畏。
JavaScript 的学习本身就相当耗时，而且没有人真正精通它，因为随着语言的发展，它的 API 和文档也在不断更新。此外，还有很多框架和库需要学习。
这种想法已经过时了，幸运的是，我在找工作期间看到了曙光。当时的公司正在寻找通晓多种编程语言的开发人员，也就是那些了解并能够使用多种编程语言的人。
扩展你的知识
那时我意识到，光会 JavaScript 是不够的，如果你想真正脱颖而出，你需要能够使用不同的编程语言。所以当时我决定学习 TypeScript 和 Python。讽刺的是，我最终找到了一份工作，但公司只要求我会 JavaScript，所以很遗憾，我学过的 TypeScript 和 Python 大部分都忘了，因为我很少在日常工作中使用它们。
这一切都发生在我活跃于科技推特和开始写博客之前，所以我真的不理解公开开发和从事业余项目的概念。我的理由是我已经有工作了，所以周末不需要再编程。
疫情期间找工作
时间飞快，到了2021年，一切都变了。我们正处于这场全球疫情的第二年，与新冠共存。我花了大约6个月的时间才拿到一份不错的工作机会，之后就一直在这家公司工作。在此期间，我参与了一些使用Python和Kotlin作为后端的项目。因此，我接触到了不同的语言。
JavaScript 仍然是世界上最受欢迎的编程语言之一，并且需求量始终居高不下。它在Stackoverflow 2021 年调查中名列前茅，而 TypeScript 排名第七。既然 JavaScript 如此受欢迎，并且在世界范围内备受追捧，为什么还要学习 TypeScript 呢？
为什么你应该学习 TypeScript
JavaScript 虽然很优秀，但与其他现代编程语言相比，它仍然存在诸多缺陷。不幸的是，很多人因为各种原因根本不喜欢 JavaScript。
TypeScript 本质上是一种开发 JavaScript 项目的现代方法，该语言会编译为原始 JavaScript，因此浏览器和其他可能不了解 TypeScript 的开发人员仍然可以读取你的代码库。它的语法完全是 JavaScript，所以即使你不熟悉 TypeScript，你仍然可以理解其中的含义。
TypeScript 旨在解决 JavaScript 的诸多问题，这使得该语言与其他现代编程语言更加接近。在我看来，任何讨厌 JavaScript 的人都可能会爱上 TypeScript。或者至少会少一些抱怨它的理由。
JavaScript 与 TypeScript
两者之间存在很多差异，我将在这里介绍其中的一些。
编译错误
TypeScript 能够在开发过程中在编译时标记错误。这是一个非常好的功能，因为它意味着在应用程序构建并运行时出现错误的可能性更小。JavaScript 只能在运行时发现这些错误，因此调试速度很可能会大大降低，因为你现在需要进行更多不必要的检查。TypeScript 中提供的更强大的工具能够提供更佳的代码编写体验。
静态类型与动态类型
JavaScript 使用动态类型，而 TypeScript 使用静态类型。动态类型允许重新分配变量，因为数据类型可以更改。静态类型则无法做到这一点，因为数据类型是预先定义的，这意味着如果您尝试分配不同的数据类型，将会报编译错误。每种方法各有利弊。
// This is valid JavaScript code
let num = 10;
num = '10';
// You will get the error Type 'string' is not assignable to type 'number'.
let num: number = 10;
num = '10';
使用界面描述您的数据
TypeScript 可以在代码中使用接口，该接口几乎描述了应用程序中对象的结构。它定义了对象所需的整体语法，因此您可以在代码编辑器中使用它进行文档编写和问题跟踪。
值得注意的是，TypeScript 编译器不会将接口语法转换为 JavaScript。它仅用于类型检查，也称为“鸭子类型”或“结构子类型”。
// Describe the shape of objects in your code.
interface Series {
id: number;
seriesName: string;
releaseDate: number;
}
// Use the interface for type checking in your object.
const series: Series = {
// The id needs to be a number
id: 1,
// The series name needs to be a string
seriesName: 'The Book of Boba Fett',
// The release data needs to be a number
releaseDate: 2021,
};
console.log(series);
CommonJS 模块与 ES 模块
Node.js 默认使用 CommonJS 模块，任何熟悉它的人都会了解它的require语法。相比之下，当你使用 Node.js 和 TypeScript 时，你可以选择使用 orrequire和importandexport语句。当然，如果你仔细研究，也可以找到在原生 JavaScript 中运行的方法。
JavaScript CommonJS 模块
const express = require('express');
TypeScript ES 模块
import express from 'express';
使用 TypeScript 时，您可以访问一个tsconfig.json文件，该文件允许您更改许多设置，包括target。这允许您设置输出 JavaScript 文件的 JavaScript 语言版本。例如，它们可以是 ES2015、ES2016、ES2017 等……
TypeScript 的缺点
TypeScript 非常棒，但它也有一些你应该注意的缺点。首先，TypeScript 无法在浏览器中运行，所以你必须先将代码编译成 JavaScript 才能使用它。
幸运的是，TypeScript 有一个编译器，所以当你设置好它后，它会自动将你的 TypeScript 文件编译成 JavaScript，而且编译过程非常快。所以你不必担心代码编译需要等待几分钟，整个过程通常只需几秒钟即可完成。
另一个缺点是，你需要编写更多代码，尤其是在需要进行静态类型检查的情况下。不过，我并不认为这是一个缺点，因为你编写的代码性能更高、更优秀，也更易于维护。
您还需要知道的是，除了一些常用的包之外，您还需要一些类型声明包。类型声明包描述内置对象。声明文件为您提供了声明类型或值的方法，因此无需为这些值提供任何类型的实现。
情况并非总是如此，因为有些包已经有类型定义，但并非所有包都有。下面这个 Express Node.js 示例更容易理解。
JavaScript Express 应用
npm i express
const express = require('express');
const app = express();
app.get('/', (req, res) => {
res.send('Home Route');
});
const port = process.env.PORT || 3000;
app.listen(port, () => console.log(`Server running on port ${port}, http://localhost:${port}`));
TypeScript Express 应用
npm i express @types/express @types/node
import express, { Response, Request } from 'express';
const app = express();
app.get('/', (req: Request, res: Response) => {
res.send('Home Route');
});
const port = process.env.PORT || 3000;
app.listen(port, () => console.log(`Server running on port ${port}, http://localhost:${port}`));
TypeScript 支持
TypeScript 得到了很好的支持，如果你选择的代码编辑器是 Visual Studio Code，那么 TypeScript 就会被视为一等公民，因为微软开发了代码编辑器和语言。
几乎所有流行的 JavaScript 框架都支持 TypeScript，包括 React、Angular、Vue 和 Svelte。express.js 框架也与其他 Node.js 框架兼容 TypeScript。因此，在应用程序的前端和后端使用 TypeScript 完全没有问题。
另一个优势是，您现在可以在后端和前端原生使用 ES 模块。例如，如果您正在创建一个使用 Node 后端和 React 前端的应用程序，现在您可以同时使用importandexport语句，而不再需要使用 CommonJS 模块require语句。
如何学习 TypeScript
我从 Scrimba 学习了 TypeScript，也参加了 Udemy 上另一门很棒的 TypeScript 课程。如果你已经了解 JavaScript，那么很快就能上手。如果你是 JavaScript 新手或仍在学习基础知识，那么最好等到有了更多经验后再学习 TypeScript。
免费学习 TypeScript
理解 TypeScript - 2022 版