美文网首页TypeScript 文档学习
TypeScript 01 - 基础类型

TypeScript 01 - 基础类型

作者: 晓风残月1994 | 来源:发表于2019-11-26 22:30 被阅读0次

    开篇前言

    直接看英文官方文档最靠谱,更新最及时,我搜出来的中文文档,要么不确定内容是否过时,要么翻译官方英文文档中的例子时,存在遗漏了关键描述的情况(比如介绍在泛型约束中使用类型参数时的那个例子),没错我说的是这个翻译地址:

    https://www.tslang.cn/docs/handbook/generics.html

    相对的,下面这个中文地址就比较靠谱,一直在更新:

    https://typescript.bootcss.com/generics.html

    一方面文档字太多,另一方面为了边学习文档边写点自己的理解,所以有了我写的这个随笔。毕竟学过的东西,尝试总结述说出来会加深理解,且需要的时候,能快速找回记忆。

    即使不打算使用 TS 开发项目,了解一下 TS 基本语法还是非常有价值,收益立竿见影(比余额宝要快)。因为目前项目中依赖了不少第三方库,比如 react、ant design、axios 等,他们都提供了类型声明文件,这使得平时在调用它们的 API 时,可以很好地借助编辑器查看 API 的接口定义,有时候比再去官网翻文档更快更准确,因为你看到的定义正是来自于当前项目中正在使用的版本。


    基础类型

    • Boolean
    • Number
    • String
    • Array
    • Tuple
    • Enum
    • Any
    • Void
    • Null and Undefined
    • Never

    Boolean、String、Number 和原生一样,参见下方。

    // Number 类型
    
    let decimal: number = 6
    let hex: number = 0xf00d
    let binary: number = 0b1010
    let octal: number = 0o744
    
    
    // Array 类型 有两种使用方法
    
    let list: number[] = [1, 2, 3]
    let list: Array<number> = [1, 2, 3]
    
    
    // Tuple 元组类型 可以用固定数量的元素表示一个数组且元素类型不一定相同
    // 注意!自从 TypeScript 3.1 版本及之后,Tuple 类型不能再访问越界元素
    
    let x: [string, number]
    
    x = ['hello', 20]
    
    
    // Enum 枚举类型 可以为一组数值赋予对应的名字
    
    enum Color {
      Red,
      Green,
      Blue
    }
    
    let c: Color = Color.Blue
    
    let colorName: string = Color[2]
    
    console.log(colorName, Color.Red)
    console.log(Color)
    
    
    // Any 类型 表示任何类型
    // TS 中会自动类型推断,即使不指定类型
    
    let notSure: any = 4
    notSure = 'maybe a string instead'
    notSure = false
    
    let list: any[] = [1, true, 'free']
    list[1] = 100
    
    
    // void 和 any 相反,表示没有任何类型
    
    // 比如用来表示函数没有返回值
    function warnUser(): void {
      console.log('This is my warning message')
    }
    
    // 声明一个 void 类型的变量是没有意义的
    // void 类型只能使用 undefined 或 null 赋值
    let unusable: void = undefined
    
    
    // null 类型和 undefined 类型
    // 在 TS 中,null 是 undefined 的父类型,
    // 所以 undefined 可以赋值给 null
    let u: undefined = undefined
    let n: null = undefined
    
    // 用 null 赋值给其他类型,默编译通过不报错
    // 但如果编译时开启检测 --strictNullChecks
    let num: number = 3
    num = null
    
    // 开启检测后能规避很多潜在问题,但如果就是想给 num 赋值为 null,
    // 可以使用联合类型
    let num2: number | null = 3
    num2 = null
    
    
    // never 类型,表示永远不存在的数据类型,
    // never 是任何类型的子类型可以赋值给任何类型,但不能被任何类型赋值,包括 any
    
    // never 使用场景1
    function error(message: string): never {
      throw new Error(message) // 不能有到达的终点
    }
    
    function fail() {
      return error('something faild')
    }
    
    // never 使用场景2
    function infiniteLoop(): never {
      while (true) { // 不能有到达的终点
        // ...
      }
    }
    
    // object 类型,是一个比较泛的类型,不能被赋值为简单类型 Object.create
    // 只能传入 Object 或者是 null
    
    // 下面的方法声明,类似于原生的 Object.create() 方法
    declare function create(o: object | null): void;
    create(42) // 不行
    create('string') // 不行
    create(false) // 不行
    create({ prop: 0 })
    create([1, 2, 3])
    create(null)
    create(undefined)
    create(null)
    
    
    // 类型断言,有时候你比 TS 更知道会是什么类型,所以可以强制将类型进行转换
    
    let someValue: any = 'this is a string'
    // 定义为 any 后,敲下面代码时,是不会自动提示存在 length 属性的
    someValue.length
    
    // 强制把 someValue 转换为 string 类型
    // 此时用点操作符准备写 length 这个词的时候,编辑器就会有提示
    let strLength1: number = (<string>someValue).length
    // 下面这种写法更推荐一些
    let strLength2: number = (someValue as string).length
    
    

    相关文章

      网友评论

        本文标题:TypeScript 01 - 基础类型

        本文链接:https://www.haomeiwen.com/subject/dvquwctx.html