理解 Typescript 和 JavaScript 之间的区别

我收到的常见问题之一是，JavaScript 和 Typescript 之间有什么区别？

让我们来了解一下……

从您开始编码的那一刻起，JavaScript (JS) 就会成为您所有前端项目的一部分。 如果您对 JS 有点熟悉，可以将 TypeScript 视为 JS 加上一些使您的应用程序更整洁和类型化的附加功能。 typeScript 是微软作为一个开源项目开发的，目的是让 JS 开发更高效，并尽早发现编译错误。

在本文中，我们将讨论 JavaScript 和 TypeScript 的一些重要特性以及两种脚本语言之间的差异。

什么是 JavaScript？

JavaScript 用于客户端脚本。 您可以在 HTML 页面上创建脚本或创建扩展名为 .js 的文件并将其包含在您的 HTML 文件中。 您可以看到 JavaScript 的一个常见现实示例是登录页面验证，当您的用户名/密码不正确时，您会看到一个错误。

让我们编写一个简单的 JS 代码并在浏览器上运行它：

创建一个文件 example.html 并添加以下代码：

 <script> feeling = 'happy'; feeling = 23; </script>

这段简单的代码声明了一个变量并为其分配了一个happy（字符串）值。 我们可以为同一个变量分配一个不同类型（数字）的值。 JavaScript 不会抱怨它，我们可以在任何浏览器上运行代码而不会出现任何问题。 现在，让我们从用户那里得到感受的价值：

我们的 HTML 将如下所示：

 <input type = "textbox" id = "howyoufeel">

脚本将是：

 feeling = document.getElementById("howyoufeel").value;

除非我们在脚本中进行显式检查，否则 JS 将接受来自用户的任何值并将其传递。 因此，您可以在感觉变量中放入诸如 234、@.#$% 之类的任何内容。

JavaScript 的特点

综上所述，我们可以观察到 JavaScript 的以下特点：

• 弱类型脚本语言
• 用于客户端和服务器端（使用 node.js）脚本
• 灵活动态
• 所有主流浏览器都支持
• 轻量级和解释性

如果您对掌握 JavaScript 感兴趣，请查看此 Udemy 课程。

什么是打字稿？

实际应用程序将有许多验证和动态检查。 对于此类应用程序，JavaScript 代码在某些时候会变得难以测试，主要是因为没有类型检查。 在从用户那里获取价值的同时，重要的是从一开始就让他们正确。 这就是 TypeScript 的用武之地。

TypeScript 是强类型的，并且有一个编译器会在您未定义变量的类型时发出警告。

JavaScript 和 TypeScript 都符合脚本语言的 ECMAScript 规范。 Typescript 可以运行所有的 JavaScript 代码并支持它的所有库——这就是为什么它被称为 JavaScript 的超集。

打字稿安装

要在 TypeScript 中执行我们之前的代码，我们需要使用 npm 包安装 TypeScript 编译器（如果您有 node js）。

 npm install -g typescript

或直接从 Microsoft 官方下载页面下载。 也可以使用TS Playground 来看看代码是如何从ts 转为js 的。

完成后，您可以在tsconfig.json配置项目设置，并使用任何 IDE 或文本编辑器编写 TypeScript 代码并将其保存为.ts 。

您仍然可以通过不定义变量类型而逃脱，而 TypeScript 可以推断出数据类型。 但是，如果在编译过程中给出第一个使用的类型（在我们的例子中是一个字符串）以外的任何东西，你会得到一个“感觉”错误。

代码具有可维护性和易用性的类型注释总是很整洁的：

 var feeling: string = “happy”;

不是这个！

TypeScript 提供了许多其他功能，使开发人员的生活更轻松。

打字稿的特点

Typescript 具有丰富的功能集，每个版本都带有新功能，使开发比以前更容易。 例如，在新版本（4.0）中，一些额外的特性是可变元组类型、自定义 JSX 工厂、从构造函数推断类属性等。 TypeScript 的一些典型特性是：

• 支持面向对象的编程概念，如接口、继承、类。 泛型
• 及早发现错误
• IDE 支持语法检查和建议
• 键入时更易于调试
• 反编译成 JavaScript
• 用于服务器端和客户端应用程序
• 跨平台和跨浏览器支持
• 支持所有 JS 库和扩展

为什么我们需要 TypeScript？ （TypeScript 相对于 JavaScript 的优势）

在 2012 年将 TypeScript 公开之前，微软为其内部项目开发并使用了两年的 TypeScript。他们创建了类型化 JavaScript，因为它更容易测试生产级企业应用程序的代码。 您仍然可以使用动态类型功能，但也可以在真正需要时键入变量。

考虑以下代码：

 var mynum = //get from user; addten(number){ return number + 10; }

我们希望结果总是一个数字。 但是，如果用户给出“羊”呢？ 输出将是sheep10——理想情况下，我们需要告诉用户这个操作是不可能的！

此外，当您拥有可用的类型信息时，文本编辑器和 IDE 将变得更易于使用和保存运行时错误。 在以后的时间点重构代码也更容易。

这是否意味着我们不需要 JavaScript？ （TypeScript 相对于 JavaScript 的缺点）

您可以将 TypeScript 视为 JavaScript 的扩展，但肯定不是替代品。

对于较小的代码块，TypeScript 可能会成为一种开销——安装、编译、反编译将是多余的。 使用 JavaScript，您可以简单地在 HTML 中键入您的脚本，它就会起作用。 当您每次更改某些内容时只需刷新浏览器时，调试代码也更容易。

头对头比较

现在我们已经了解了 TypeScript 和 JavaScript 的特性和优势，让我们进行更多的比较：

结论

从学习的角度来看，JavaScript 可能是你的自然选择。 您打开一个文件，在<script></script>标签中输入一些内容，将其保存为 HTML – 您将看到结果！ 然后，您可以在此基础上创建更多动态内容。

此外，当您处理大型应用程序时，拥有 JavaScript 知识将帮助您轻松转向 TypeScript。

但是，从职业和薪酬的角度来看，作为 TypeScript 开发人员，您将更加灵活和适应 JS 和 TS 项目——因此绝对是市场上更好的资产。 通常，TypeScript 开发人员的年薪在 11 万美元至 14.7 万美元之间，而 JS 开发人员的年薪约为 6.3 万美元至 11.8 万美元。