我希望拥有的 Typescript 指南 — 阅读错误，第 1 部分
我希望拥有的 Typescript 指南 — 阅读错误，第 1 部分
通过视觉指南和简单的语言学习如何阅读 Typescript 中的错误
Typescript 可能充斥着错误和警告，似乎是每一件小事。以这个函数为例：
（如果你不确定什么 ：数字 可能意味着在函数参数内部，我将对此进行介绍，以及更多内容 本指南的前一章 ，但不用担心，我们也会在本文中重温一下。）
在严格模式下，使用 TS eslint 设置，typescript 实际上会因为这个甚至使用 typescript 的完美工作功能而向你发出警告！错误如下所示： 函数缺少返回类型 .
翻找错误可能会让人头疼，因此在本文中，我们将介绍错误列表和 如何理解 ，并深入解决它们。由于打字稿中有大量不同的错误，本章将分成许多部分，以涵盖广泛的错误。随意添加书签并重新访问它，以防您将来遇到任何这些讨厌的错误。让我们开始！
1.“函数缺少返回类型”
原因：
我们 没有 告诉 typescript 我们期望从函数返回什么。很多时候，打字稿可以假设这一点，但在 严格的 模式，它会期望你声明这一点。
解决方案：
在函数参数的结束参数后放置一个冒号，并写下您希望函数返回的类型，如下所示：
小费 — 如果你不确定你的函数可以返回哪些类型； 一世 _在您的文本编辑器中，您可以将鼠标悬停在函数名称上，打字稿将向您显示可以使用的返回类型。这将在 99% 的时间内有效！ _
为什么返回类型很重要：
函数可能会返回很多不同的结果。甚至像这样简单的东西 addTwoNumbers 可以回来 数字 , 钠 , 无效的 , 空白 ，甚至一个 细绳 取决于你如何设计它。因此，TS 希望您清楚地列出它应该期望的所有可能的返回值。如果您正在构建一个 API，这将特别有用 其他 人们将与之合作。帮助他们可靠地了解预期的数据类型可以将您的 API 与其他没有的 API 区分开来。
返回类型最酷的部分是 ，在使用函数时，如果您正在重构或更新它，并且您不小心（或不知不觉地）忘记返回预期的（重要）属性，TS 将 让你知道。 此外 , 它可以为您自动完成可用属性的列表，以帮助您发现更多关于您在代码中使用的数据的信息。我们将很快介绍所有这些。
我们将使用我为本文制作的这个小应用程序来查看其他几个实际操作中的错误（和好处）。随意在那里闲逛……我们将在下面详细介绍。
让我们解压上面的应用程序。在线的 25 ，我们正在使用 getUserByRole 函数根据用户返回一些用户数据 角色 .在此应用程序中，用户可以是 行政 , 或 来宾 .
使用接口，我们可以描述 管理员用户 和一个 访客用户 看起来并通过将其传达给我们的功能 :管理员用户 |访客用户 在它的论证主体之后。这就是我喜欢将其可视化的方式：
既然我们定义了什么是 管理员用户 和一个 访客用户 看起来，typescript 可以为我们做很多很酷的事情。以这段代码为例：
只需要写 如果（角色 === '管理员'） , 打字稿可以 告诉 我们正在谈论的 管理员用户 并准备期望返回其特定形状的数据。这就是所谓的 类型缩小 .当你缩小类型列表时（官方称为联合，它看起来像这样 → 类型1 |类型2 ) 到一个更小、更具体的列表，例如 管理员用户 |访客用户 只是 管理员用户 . Typescript 可以通过评估属于我们提供的类型的属性来解决这个问题。
✨ Typescript 有助于提供可用于 管理员用户 .这可以让我们深入了解对象。
自己试试吧！在下面的应用程序中，注释行 33-35。 然后，当您的光标位于对象主体内时，按 ctrl + 我 或者 命令 + 我 （对于 Mac）获取属于 管理员用户 ！
笔记 ： 属性列表将 只要 显示当前未列出的对象属性。因此，如果您已经返回其所有属性，则该命令将不再显示可用属性。
如果我们试图检查一个角色不存在的用户，比如“作家”，该怎么办？如 如果（角色==='作家'） .那，将导致我们的下一个错误。
2. 由于类型为“UserRoles”和“”，此条件将始终返回“false” 作家 ''没有重叠。
原因：
我们尝试比较的一个（或多个）值与告诉打字稿的内容不一致。在上面的应用示例中，这是因为我们只有两个角色，“admin”和“guest”。我们的定义中不存在“作家”角色。这是我喜欢将其可视化的方式。
此条件将始终返回 'false'，因为类型 'UserRoles' 和 '“writer”' 没有重叠
让我们逐字逐句分解错误。
**这个条件** ——条件评估；那是 如果 块，或者它可能是一个 三元 等任何比较值和结果的东西 真的 或者 错误的 .
**将始终返回“假”** ——它永远不会运行那段代码！它不会进入条件，因为它总是错误的......基本上是这样的： if(false) {/* 永远不会运行 */} .
**因为类型'UserRoles'** — 在这种情况下，'UserRoles' 是 Typescript 引用的值作为其事实来源。请注意 用户角色 是我选择的名字，它可以是任何你想要的。在您的应用程序中，这将匹配提供给 TS 的任何类型。
**和“作家”** ——这就是你的价值 试 使用；这导致了错误。
**没有重叠** —您尝试使用的值不存在于事实来源中（ 用户角色 ) Typescript 正在引用。您可以将其添加到提供给 TS 的列表中，也可以坚持使用联合中的值之一 ( 用户角色 ）。
解决方案：
以下之一：
一个 .更新类型 用户角色 （在这个例子中）包括“作家”，像这样： 类型 UserRoles = '管理员' | '客人' | '作家' .
或者
乙 .回退到使用提供的值 用户角色 （在这种情况下，'admin' 或 'guest'）所以我们在使用的值中得到“重叠”。
对于下一个错误（TS 中最常见的错误之一），跳到下面的文本编辑器并将任何字符串值更改为不同的数据类型，例如数字。例如，在线 _40_ ，将“guest123”更改为数字，例如， _2_ .
3. 类型“数字”不可分配给类型“字符串”
或者 类型“[TYPE_1]”不可分配给类型“[TYPE_2]”
原因：
我们正在尝试使用与 Typescript 所期望的不匹配的类型。第一种， TYPE_1 是我们试图使用的。另一种类型， TYPE_2 是打字稿所期望的。这是我喜欢如何可视化此错误的方式。
我们告诉 typescript 角色 可以 只要 做个“客人”，然后我们转身尝试设置一个数字， 78 作为值 角色 .这种情况经常发生，尤其是对于我们没有构建的复杂数据和 API。
解决方案：
使您的类型符合预期，或更新预期。在上面的示例中，一种解决方案可能是更改数字 78 至 “来宾” 或者，如果我们想允许这个数字 78 具体来说。我们可以更新 访客用户 允许的接口 78 或任何通用的 数字 价值。这是一个例子：
我们对打字稿错误的深入演练的第 1 部分到此结束。本文是 Typescript 多个主题的滚动系列文章的一部分，因此如果您对更多此类文章感兴趣，请在最新发布时关注以获取更新！我真诚地希望这篇文章对“我希望拥有的 Typescript 指南”系列的第二部分有所帮助。谢谢阅读。
PS：如果您有任何错误希望详细介绍，请在评论中发出声音，或DM我！再次感谢。
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明
