TypeScript 使用规则

这是我参与8月更文挑战的第16天，活动详情查看：8月更文挑战

前言

“八月的色彩是用金子铸就的，明亮而珍贵；八月的色彩是用阳光酿造的，芬芳而灿烂。”

未来的日子，愿你把自己调至最佳状态，缓缓努力，慢慢变好 Y(^o^)Y

类型定义

• 【推荐】定义数组类型时，若数组元素为原始类型，则强制使用 T[] 形式定义。tslint: array-type

  // bad
  function (arr: Array<number>) {
  }
  // good
  function (arr: number[]) {
  }
  

• 【推荐】当需要强制转换类型时必须只用 as Type 。tslint: no-angle-bracket-type-assertion

  在 .tsx 文件中只有 as 语法生效，为保持类型转换风格一致，强制统一使用as Type方式转换类型。

   ```
   // bad
   <number>foo
   // good
   foo as number
   ```
  

• 【参考】尽量减少 any 类型声明

  允许适度的使用 as any 方法进行类型转换，或将变量类型声明为 any

• 【强制】不要对 any 类型数据进行操作。tslint: no-unsafe-any
  如果数据来源不能控制（来自第三方 API 等），则在类型声明时建议使用泛型或 Partial 语法，保证代码中读取的结构一定存在。

    ```
    // bad
    const obj = JSON.parse(str) as any;
    const result = obj.a.b;
    
    // good
    interface JSONResult {
      a: {
        b: number;
      }
    }
    const obj = JSON.parse(str) as JSONResult;
    const result = obj.a.b;
    ```
  

• 【推荐】对于可以自动推导的类型无需显式声明。tslint: no-inferrable-types

  // bad
  const str: string = 'str';
  // good
  const str = 'str';
  

• 【强制】不要使用 <reference path= 方式引用定义文件 /> tslint: no-reference

  推荐使用 ES6 的 import 语法引入定义文件

  // bad
   <reference path="react/index.d.ts" />
  // good
  import React from 'react';
  

• 【强制】类型断言必须使用 as Type @typescript-eslint/consistent-type-assertions 类型断言（type assertiions）也可称作类型转换（type casting），本质上是对 TypeScript 类型系统的人为干预

    // bad 
    const name = <string>'bar';
    // good 
    const foo = 'bar' as string;
  

模块定义

• 【强制】不要使用 module 和 namespace 组织代码。tslint: no-namespace

  TypeScript 中的 module 和 namespace 是可以用来对代码进行逻辑组织的方式，推荐统一使用 ES6 的 import/export 语法进行代码组织。 对于扩充外部模块定义的语法 declare module 'xxx' 依然可以使用。

   ```
   // bad
   module a {
   }
   // good
   import { a } from './a';
   ```
  

结语

如果这篇文章帮到了你，欢迎点赞👍和关注⭐️

文章如有错误之处，希望在评论区指正🙏🙏。