类型系统如何改进你的 JavaScript 代码

原始 JavaScript 本质上是无类型的，有些人称其为“智能”，因为它能够分辨出什么是数字或字符串。

这使得 JavaScript 代码的运行变得更加简单，只需在浏览器或 Node.js 运行时中执行即可。然而，它容易受到许多运行时错误的影响，从而破坏用户体验。

如果您曾经经历过以下情况，那么采用类型系统将会对您有益。

• 获取数据列表后，您可能会发现某个记录中不存在某个字段，除非明确处理，否则会导致应用程序崩溃。
• 您导入的类的实例没有您尝试调用的方法。
• 您的 IDE 不知道有哪些方法和属性可用，因此它无法轻松地协助您进行自动完成。
• 代码推理困难，一目了然的类型系统使重构变得更容易

Flow、TypeScript 或 ReasonML

假设你有一个现有的代码库，希望让它变得万无一失。关于类型错误，你可以尝试采用 Flow 或 TypeScript——它们的语法非常相似。

另一方面，在现有的大型代码库中采用其中一种方案非常困难。你会积压大量与创建类型和接口相关的任务，而这些代码的设计方式可能并不友好。

除此之外，Flow 和 TypeScript 的代码并不能提供 100% 的类型安全性。

Reason 通过推理实现了完美的类型安全，并使注释变量和函数签名更加直接。

简单且明显设计的例子

考虑以下代码：

let add = (a, b) => a + b;

在基础 JavaScript 中，这些参数可以是数字或字符串。在 TypeScript 或 Flow 中，这些参数可以像这样注释：

let add = (a: number, b: number) => a + b

第一个代码片段知道我们要将两个 int 值相加。不是两个浮点数，也不是两个字符串，这些加法运算有不同的运算符。JavaScript 很难区分 int 和 float 之间的区别。

现在请允许我用一个虚构的例子来揭示这种渐进式打字。

let add = (a: string, b: number) => a + b
add('some string', 5) // outputs: "some string5"

这个函数成功了！这简直太荒谬了！Reason 是怎么解决这个问题的呢？

let add = (a, b) => a + b;
add("some string", 5);
/*
This has type:
  string
but somewhere wanted:
  int
*/

此函数在实现层面存在缺陷。Reason 对整数、浮点数和字符串的加法有不同的运算符。

这个人为的例子的目的是表明即使它不会破坏应用程序，仍然很有可能出现奇怪类型的“错误”。

在纯 Reason 程序中，开发人员不必处理与类型或空值有关的生产错误。

开发者体验

TypeScript 最出色的功能之一是代码编辑器建议和自动完成功能的增强。

这是 TypeScript 优于 Reason 的一个方面，因为 TypeScript 程序无需完美编译即可提供自动补全功能。Reason 会先提示你修复语法或类型错误，然后再提供有用的自动补全建议。

VSCode 就是这样，但我知道很多 Reason 开发者都使用 Vim。我无法保证每个编辑器的支持程度。

虽然我是 ReasonML 的忠实粉丝，但我也用 TypeScript 或 Flow 构建过生产应用程序，并且也很喜欢它们。TypeScript 的浪潮使得它如今尤其值得学习，因为它背后有大量的写作和社区支持。

另一方面，理性则更难理解，因为其背后的文字和内容相对较少。我希望通过像这样的博客文章来改变这种现状。

如果您有兴趣了解 Reason，我建议您先阅读这里的文档。另外，请务必在 Twitter 上关注@jordwalke、@jaredforsyth和@sgrove等人。他们对 ReasonML/OCaml 生态系统非常了解。

如果您想了解 ReasonML 如何与 GraphQL 无缝协作，请查看我撰写的《ReasonML 与 GraphQL，类型安全 Web 应用程序的未来》一文。

如果您想了解以后的帖子，请在此注册我的新闻通讯！