新手入门typeScript

错误更早暴露
• 代码更只能，编程更准确
• 重构更牢靠
• 减少不必要的类型判断

Flow静态类型检查方案 (工具)

• 参数-> 类型注解
• 使用-> yarn add flow-bin --dev
• flow编译移除注解-> yarn add flow-remove-types --dev yarn flow-remove-types src -d dist

yarn add @babel/core @babel/cli @babel/preset-flow --dev
• 项目中引入.babelrc 文件{“presets”: ["babel/preset-flow"]}
• yarn babel src -d dist

建议手动添加类型注解
• 原始类型

  const a: string = 'aax';
  const b: number = Infinity;
  const c: boolean = false;
  const d: null = null;
  const e: void = undefined;
  const f: symbol = Symbol();

   

const arr1: Array<number> = [1,2,3];

const arr2: number[] = [1,2,3];

// 元组  数组长度固定
const arr3: [string, number] = ['hello', 123]

const obj1: {foo: String, bar: number} = {foo: 'string', bar: 100}

const obj2: {foo?: String, bar: number} = { bar: 100 }

const obj3: { [string]: string } = {}
obj3.key1 = 'value1'
obj3.key2 = 100

• [li]函数类型

  function foo(callback: (string, number) => void) {
  callback(string, 100)
  }

   

const type: 'success' | 'warning' | 'danger' = 'success'

type StringOrNumber = string | number

const b: StringOrNumber = 'string' // 100

const gender: ?number = null // undefined

const gender2: number | null | void = null

都是指定了任意类型，但是any是弱类型（主要是兼容老代码用的，实际项目中不建议使用），mixed是强类型。执行阶段会非法校验

类型手册：https://www.saltycrane.com/cheat-sheets/flow-type/latest/

运行环境API 对象