AI智能
改变未来

新手入门typeScript


强类型与弱类型(类型安全)

  • 强类型不允许随意的隐士类型转换,而弱类型是允许的
  • 变量类型允许随时改变的特点,不是强弱类型的差异

静态类型与动态类型(类型检查)

  • 静态类型:一个变量声明时它的类型就是明确的,如果声明后,它的类型就不允许修改。
  • 动态类型:运行阶段才能够明确变量类型,而且变量的类型随时可以改变。

JavaScript 自有类型系统的问题

  • 任性:缺失了类型系统的可靠性
  • javaScript没有编译环节,初期发展就设计成弱类型、动态类型语言
  • 大规模应用下,这种优势也是劣势

弱类型的问题

  • [li]君子约定有隐患,强制要求有保障

[/li]

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

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

    • 参数-> 类型注解
    • 使用-> yarn add flow-bin –dev
    • flow编译移除注解-> yarn add flow-remove-types –devyarn flow-remove-types src -d dist
  • 使用babel代替flow工具
      yarn add @babel/core @babel/cli @babel/preset-flow –dev
    • 项目中引入.babelrc 文件{“presets”: [\”babel/preset-flow\”]}
    • yarn babel src -d dist
  • vscode插件:flow-language-support 开箱即用
  • flow官网支持的编辑器 https://flow.org/en/docs/editors
  • flow 类型推断
      建议手动添加类型注解
    • 原始类型
      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)}

    [/li]

  • 字面量类型
      const type: \'success\' | \'warning\' | \'danger\' = \'success\'type StringOrNumber = string | numberconst b: StringOrNumber = \'string\' // 100const gender: ?number = null // undefinedconst gender2: number | null | void = null
  • mixed与any类型
      都是指定了任意类型,但是any是弱类型(主要是兼容老代码用的,实际项目中不建议使用),mixed是强类型。执行阶段会非法校验

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

    运行环境API 对象

  • 赞(0) 打赏
    未经允许不得转载:爱站程序员基地 » 新手入门typeScript