美文网首页
Typescript - 基础(二)

Typescript - 基础(二)

作者: 酷热summer | 来源:发表于2020-05-03 11:10 被阅读0次

    TS 的基本类型和枚举类型

    1、TS 的数据类型和 ES6 的数据类型

    共有数据类型:

    • Boolean
    • Number
    • String
    • Array
    • Function
    • Object
    • Symbol
    • undefined
    • nul
      除此之外,TS 新增类型:
    • void
    • any
    • never
    • 元祖
    • 枚举
    • 高级类型

    2、数据类型介绍

    // 原始类型
    let bool: boolean = true
    let num: number = 123
    let str: string = 'abc'
    // str = 123 如果将 str 赋值为一个数字,则编辑器会直接提示错误,数据类型一旦定义不可改变
    
    // 数组
    let arr1: number[] = [1, 2, 3]
    let arr2: Array<number> = [1, 2, 3]    // 数组内的数据类型均为 number
    // let arr2: Array<number | string> = [1, 2, 3, '4']      
    // <number | string> 为联合类型,这样数组元素可以是数字和字符串
    
    // 元组
    let tuple: [number, string] = [0, '1']
    // 元祖是一种特殊的数组,限定了数组元素的个数和类型,且第一必须是 number,第二个必须是 string
    // tuple.push(2),数组的 push 方法元祖也可是使用,但是**不建议**
    // console.log(tuple)  // [0, '1', 2]
    // tuple[2] 可以 push 但是不允许访问
    
    // 函数
    let add = (x, y) => x + y  // 这么写的话,会提示 x 隐式具有 any 类型,正确的写法为: let add = (x:number, y: number) => x+y;
    // 也可以写为 let add = (x:number, y: number):number => x+y; 返回值类型可不写,利用函数推断功能可直接定义返回值类型
    
    // 对象
    let obj: object = { x: 1, y: 2 }   // 错误定义
    // let obj: { x: number, y: number } = { x: 1, y: 2 }  // 正确的定义
    // 在 js 中可以任意修改属性,如 obj.x = 3,但是在 ts 中是不允许的
    
    // symbol
    let s1: symbol = Symbol()
    let s2 = Symbol()
    // console.log(s1 === s2)    // false
    
    // undefined, null
    let un: undefined = undefined   
    let nu: null = null
     // 如果被声明为 undefined / null,就不能在被赋值为其他,同理,其他类型也不可以赋值为 undefined / null
    // undefined / null 是任何类型的子类型,但是需要将 tsconfig.json 中的 strictNullChecks 设置为 false 即可,但是不建议这么做。如果希望其他类型赋值为 undefined,那么就需要使用联合类型:
    let a : string | undefined | null = 'test';
    
    // void,返回 undefined
    let noReturn = () => {}
    
    // any,兼容 JS,可以任意赋值
    let x
    x = 1
    x = []
    x = () => {}
    
    // never,永远不会有返回值
    let error = () => {
        throw new Error('error')
    }
    let endless = () => {
        while(true) {}
    }
    

    2、枚举类型

    枚举: 一组具有常量名字的集合。枚举主要分为数组枚举和字符串枚举。

    • 数字枚举,取值从 0 开始
    enum Role {
      Reporter,
      Developer,
      Maintainer,
      Owner,
      Guest
    }
    console.log(Role.Reporter)   // 0,后面成员的值会递增
    console.log(Role)  // {0: "Reporter", 1: "Develpoer".....}
    enum Role1 {      // 后面的值仍然递增,不过是从 2 开始
      Reporter = 2,
      Developer,
      Maintainer,
      Owner,
      Guest
    }
    // 反向映射实现
    
    • 字符串枚举
    // 不可以进行反向映射
    enum Message {
      Success = '恭喜你,成功了',
      Fail = '抱歉,失败了'
    }
    
    • 异构枚举
    // 容易混淆,不建议使用
    enum Answer {
      N,
      Y = 'Yes'
    }
    

    2.1 枚举成员的性质

    • 枚举值不可修改

    2.2 枚举成员的分类

    • const number: 常量枚举,会在编译时计算出结果,以常量出现在运行时环境,见示例枚举值 a、b、c
      • 没有初始值的情况
      • 对已有枚举成员的引用
      • 常量表达式
    • computed member:需要计算的枚举值成员,非常量的表达式,编译阶段不会计算,而会被保留到执行阶段,如下 d、e
    enum Char {
      // const member
      a,
      b = Char.a,
      c = 1 + 3,
      // computed member
      d = Math.random(),
      e = '123'.length,
      f = 4
    }
    
    • 常量枚举:cosnt 声明的枚举就是常量枚举,会在编译阶段被移除。当不需要对象而只需要对象的值的时候,可以使用常量枚举。
    const enum Month {
      Jan,
      Feb,
      Mar
    }
    let month = [Month.Jan, Month.Feb, Month.Mar] ;
     console.log(month);   // [0,1,2]
    
    • 枚举类型
      • 所有成员均无初始值
      • 所有成员均是数组
      • 所有成员均是字符串
    enum E { a, b }
    enum F { a = 0, b = 1 }
    enum G { a = 'apple', b = 'banana' }
    
    let e: E = 3
    let f: F = 3
    // console.log(e === f)
    
    let e1: E.a = 3
    let e2: E.b = 3
    let e3: E.a = 3
    // console.log(e1 === e2)
    // console.log(e1 === e3)
    
    let g1: G = G.a
    let g2: G.a = G.a
    

    相关文章

      网友评论

          本文标题:Typescript - 基础(二)

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