合理使用 TS 的枚举类型

最近发现不少新手或有一定 TS 使用经验的的开发同学并没有充分发挥 TS 枚举值的能力，代码中很容易见到 if(status === 1){} else if (status === 2){} 这种魔法数字，项目只要稍微复杂一些，这种魔法数字维护起来就是一场灾难。

类似上图中的枚举状态在开发中很常见，我们可以使用 TS 的枚举类型来提高维护性，减少 bug

bad:

if (status === 1) {
   //
} else if (status === 2) {
  //
}

good:

export enum TaskStatus {
  // 处理中
  processing = 0,
  // 成功
  success = 1,
  // 异常
  error = 2,
}

if (status === TaskStatus.processing) {
   // 处理中
} else if (status === TaskStatus.success) {
  // 成功
} else if (status === TaskStatus.error) {
  // 异常
} else {
  // 无效的枚举值
}

当然你也可以使用 switch 语句代替上面的写法。

在类型定义文件引入枚举值

有时候你可能需要在一些全局的 .d.ts 类型声明文件中引用其他模块中定义的枚举值，这种情况可以通过 import() 语句来引入其他枚举值而不破坏 .d.ts 文件的作用范围，例如

Bad:

// xxx.d.ts
import { AppType } from '@/componets/AppCard'
declare interface AppState {
  name: string
  type: AppType
}

Good:

// xxx.d.ts
declare interface AppState {
  name: string
  type: import('@/componets/AppCard').AppType
}

尽量避免使用 any

本文原载于：baiyun.me

原文链接：https://baiyun.me/improve-maintainability-with-typescript

如果你喜欢我的内容，请考虑请我喝杯咖啡☕吧，非常感谢🥰 。

If you like my contents, please support me via BuyMeCoffee, Thanks a lot.