27

TypeScript: 请停止使用 any

 3 years ago
source link: https://mp.weixin.qq.com/s?__biz=Mzg2NDAzMjE5NQ%3D%3D&%3Bmid=2247486744&%3Bidx=1&%3Bsn=c8a85a5f81557059e5c29b63d4353084
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

RJBBJzQ.png!mobile

本文译自:https://thoughtbot.com/blog/typescript-stop-using-any-there-s-a-type-for-that

当我们开发 TypeScript 代码时,很可能会遇到 any 关键字。我们看到的大多数用法都表明我们正在处理 TypeScript 中的基本类型。在文档中我们可能会找到:

(…)来不使用 TypeScript 或第3方库编写的代码的值。在这些情况下,我们可能要选择退出类型检查。为此,我们将这些值标记为 any 类型:

什么是 any

因此 any 不是通配符,也不是基类型,它是明确地与第三方库进行交互。那它为什么经常出现你呢?它对我们的系统有害吗?我们应该逃避它还是拥抱它?

any 类型是使用现有 JavaScript 的强大方法,可让您在编译期间逐渐选择加入和选择退出类型检查。

TypeScript 文档明确表达了当我们使用 any 类型时,我们正在告诉编译器:

V7NjaeI.gif!mobile

当超过500名该语言的贡献者提供帮助时,我们说 no thank you 。这听起来像是选择退出类型检查器,有了它,就不能轻易地放弃对类型系统的所有安全性和信心。我们应该使用它来与无类型的第三方(或第一方) Javascript 代码交互,或者当我们只知道类型的一部分时。

但是等等我还有很多其他原因

TypeScript 不会转换为 Javascript 吗?Javascript 不是动态的吗?那我为什么要考虑我的类型呢?

是的!但是我们用 TypeScript 写代码,这是一种静态类型语言。有人可能会说静态类型语言不会比动态语言产生更少的 bug 。不过,在使用 any 之类的静态类型语言中,这是两种情况中最糟糕的。

有些参数很难正确输入,但是 any 更容易

如果我们没有正确地输入,我们将会编写错误,比我们在动态语言中会编写更多的错误,因为我们强制 TypeScript ,一种静态类型语言,去检查不正确的类型。

我真的不知道参数是什么

没关系!我们可以用 unknown ; 它允许我们确实分配任何类型。但在确定特定类型之前,我们将不允许使用这些值。

type ParsedType = {
  id: number
}

const parseApiResponse(
  response: Record<string, unknown>
): ParsedType => {
  const convertedResponse = (response as ParsedType)

  // without doing the type cast we would
  // get a type error here
  if(convertedResponse.id >= 0) {
    return convertedResponse
  } else {
    throw Error.new("Invalid response"
  }
}

添加类型时,我必须编写大量代码,any工作量较少

可能不是,如果编写的代码没有类型,则我们可能需要添加防御性代码,以确保参数和变量具有正确的类型,以使程序能够按预期执行。 any 甚至无法防范 nullundefined 检查我们的逻辑 。

// version 1 with `any`
const fullName = (user: any) => {
  if (user?.firstName && user?.lastName) {
    return `${user.lastName}, ${user.firstName}`
  }

  return user?.firstName || ""
}

// version 1 without `any`

interface User {
  firstName: string
  lastName?: string
}

const fullName = ({ firstName, lastName }: User) => {
  if (lastName === undefined) {
    return firstName
  }

  return `${lastName}, ${firstName}`;
}

类型增加了很多复杂性,有时any更简单

使用 any 可能允许我们在不考虑数据如何流入逻辑的情况下更简单的开发。但它将这个负担会转移到我们代码的未来读者身上。他们将不得不在没有上下文和编译器帮助的情况下解释发生了什么。

有了文档,我可以提供所有上下文

添加类型时,我们会从编译器获得帮助,并且会获得不会随时间推移而衰减的文档,因为如果过时了,我们的代码将无法编译。

const intersection = (a: any, b: any): any => {
...
}
const intersection = (
  a: Set<number>, b: Set<number>
): Set<number> => {
...
}

它们都是等效的,但是读者会更好地了解后面的函数在做什么,而不是从第一个函数开始。

我已经通过必要的运行时检查以防御性的方式编写了代码,以确保没有错误

现在可能没有错误,但是除非你有很好的测试覆盖率,否则以后来修改代码的人不会相信他们不是在错误中重构;就好像编译器不会帮你,因为我们说过它不会帮你。如果我们显式地设置类型并更改系统中使用的API,编译器将提供它的指导。

如果以后我改变主意怎么办?我可能会为此重构几个小时

我们总是可以修改和适应新的类型定义, TypeScript 为此提供了一组实用功能。我们可以 Pick 习惯从先前定义的类型中选择所需的属性。 Omit 得到除少数几个以外的所有东西。 Partial 使所有属性都是可选的,或进行完整的180并使其全部 Required s。

type User = {
  id: number;
  firstName: string;
  lastName: string;
  age: number;
}

type UserParams =
  Pick<User, "id"> & Partial<Omit<User, "id">>

const updateUser = (
  { id, ...newUserParams }: UserParams
) => {
  {...}
}

很好,从TypeScript中删除 any,立即打开PR

让我们深吸一口气, any 它在正确的情况下非常强大且有用。

  • 与使用它的库接口;确保在将数据移至系统之前尽快将其转换为正确的类型。

  • 解决 TypeScript 类型错误;如果我们发现自己无法输入某些内容,则 any 可能有必要。但是只有在尝试其他所有方法之后才推荐使用。如果使用它,我们应该将其重新转换为可预测的类型。

  • 如果我们的函数可以真正处理任何类型,那么这种情况很少见,并且是偶然的(例如调试或日志记录函数)。在这些情况下,我们需要 100% 确保不存在会导致函数失败的类型。我们应该检查函数的主体,并根据输入确定最基本的形状并加以限制。例如,如果我们要打印某些内容,则至少应验证它是否响应 toString

让我们回顾一下

为什么我们不能在使用 any ?

  • 它使编译器过时了,我们告诉编译器: 我不需要你的帮助
  • 我们放弃了在编写代码时记录代码的机会

  • 我们的第一道防线被攻破了

  • 在动态语言中,我们假设事物可以有 any 类型,我们采用的模式遵循这个假设。如果我们开始使用静态类型语言作为动态语言,那么我们就是在与范式作斗争
  • 当我们继续对代码库进行更改时,没有什么可以指导/帮助我们。

  • 自由越大,责任越大(编译器)。不要变成一个编译器,我们的目的是使用编译器。

在看、点赞 支持作者心


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK