TS新增数据类型或方法

• TS新增数据类型
  • array
  • tuple
  • enum
  • any
  • void
  • never

array类型

说明

JS中操作数组的方法TS中同样有，但是TS新增两种定义数组的方法

两种定义数组的方法

类型后加[]

在元素类型后面接上[]，表示由[]前的元素组成的一个数组

 // 方法一：元素类型后加[]
    let arr1:number[]=[1,2,3]
    console.log(arr1,arr1.constructor === Array)
    let arr2:string[]=["a","b","c"]
    console.log(arr2,arr2.constructor === Array)
    let arr3:object[] = [{a:"1"},{b:"2"},{c:"3"}]
    console.log(arr3,arr3.constructor === Array)
    //联合类型声明数组
    let arr4:(number | string | object)[] = ["sj",2,{c:"3"}]

数组泛型

使用数组泛型Array<元素类型>

 // 方法二：数组泛型
    let arr4:Array<number> = [1,2,3]
    console.log(arr4,arr4.constructor === Array)
    let arr5:Array<string> = ["a","b","c"]
    console.log(arr5,arr5.constructor === Array)
    let arr6:Array<object> = [{a:"1"},{b:"2"},{c:"3"}]
    console.log(arr6,arr6.constructor === Array)
      //泛型中使用联合类型声明数组
    let arr8:Array<number | string | object> = ["sj",2,{c:"3"}]

只读数组

说明

ReadyonlyArray<元素类型>和Array<元素类型>相似,只是把所有可变方法去掉，以此确保数组创建后不会被修改

将整个只读数组赋值到一个数组也无法实现，可以采用类型断言重写

a = ro as number[]

tuple元组

说明

元祖指的是一个已知数量和类型的数组，各元素的类型不必相同

Eg

ts
let tuple1:[string,number];
    tuple1=["1",10]
    console.log(tuple1,tuple1.constructor)

注意点

1. 必须严格按照声明的顺序，否则会报错

let tuple1:[string,number];
    tuple1=["1",10]
    console.log(tuple1,tuple1.constructor)
    tuple1=[1,10]

2. 元组越界
   元组同样具有数组的push方法，但是push不会报错，push后访问会报错
   

枚举类型

说明

使用enum关键字声明，enum关键字后紧邻枚举名称，其后的花括号中为枚举成员，枚举成员可以有多个
枚举名称、成员名称首个字母大写，多个成员之间用逗号隔开

ts
enum 枚举名称 {枚举成员1，枚举成员2...}

用法

1. 枚举是一种类型，可以作为变量的类型注解

ts
enum  ColorList {Red,Green,Blue}
let UserColorList:ColorList

三种情况

• 枚举成员没有初始值
• 所有枚举成员都是数字枚举
• 所有枚举成员都是字符串枚举

// 枚举类型  
enum enum1 {a,b}
enum enum2 {a=0,b=1}
enum enum3 {a="user",b="name"}

let age:enum1 = 3 //任意数字赋值
let age2:enum2 = 10//任意数字赋值
let age3:enum3 = enum3.a //字符串枚举类型只能采用枚举中的
let age4:enum3 = "user"
console.log(age,age2,age3)

2. 访问枚举的成员，作为变量的值

UserColorList = ColorList.Green
console.log(UserColorList)// 1

3. 枚举成员只能访问(只读属性)，无法赋值修改

ts
enum  ColorList {Red,Green,Blue}
ColorList.Blue = 1  

4. 默认情况下，成员的值从0开始/也可以手动的指定成员的数值

常将枚举成员为数字类型的枚举称为数字枚举

• 枚举成员的值默认从零开始自增

ts
enum  ColorList {Red,Green,Blue}
console.log(ColorList)
console.log(ColorList[0],ColorList[1],ColorList[2])
console.log(ColorList.Red,ColorList.Green,ColorList.Blue)

• 手动指定成员的值

ts
enum ColorList {Red=1,Green=2,Blue}
console.log(ColorList)

常将枚举成员为字符串类型的称为字符串枚举

字符串枚举没有自增长的值，所以必须指定初始值

ts
enum ColorList {Red="red",Green="Green",Blue="Blue"}
console.log(ColorList)
console.log(ColorList.Red,ColorList.Green,ColorList.Blue)

枚举编译为JS后解读

Eg

Code

• TS

ts
//常量枚举  
enum constList {
    a,
    b,
    c
}

• 编译为js后

"use strict";
//常量枚举  
var constList;
(function (constList) {
    constList[constList["a"] = 0] = "a";
    constList[constList["b"] = 1] = "b";
    constList[constList["c"] = 2] = "c";
})(constList || (constList = {}));

说明

• 声明一个变量constList

var constList;

• 一个立即执行函数

constList["a"] = 0 //作为表达式返回结果为0

常见枚举类型

数字枚举

/* 
数字枚举 成员索引默认从零自增(若指定索引，则从指定索引开始自增) 
存在反向映射导致可以通过枚举成员名称获取索引，索引获取枚举成员名称  
*/
enum  ColorList {Red,Green,Blue}
console.log(ColorList)
console.log(ColorList.Red)
console.log(ColorList[0])

字符串枚举

// 字符串枚举  不存在自增长的值，必须指定初始值  不存在反向映射
enum ColorLists {Reds="red",Greens="Green",Blues="Blue"}
console.log(ColorLists)
console.log(ColorLists.Reds)
console.log(ColorLists[0])//报错

异构枚举

数字枚举和字符串枚举混用

不建议混用

enum putOff {
    red
    blue="blue"
}

常量枚举

说明

使用const关键字，编译时会舍弃

用途

需要一个对象，但是不需要对象的值时

Eg

//常量枚举  
const enum constList {
    a,
    b,
    c
}

常见枚举成员

常量枚举成员

const
会在编译时计算出结果，以常量形式出现在运行时的环境
computed
一些表达式等，编译时不会计算，程序执行时才会计算

// 枚举成员类型  
enum username {
    //const
    a,
    b = username.a,
    c = 1+3,
    // computed  需要计算的  
    d = Math.random(),
    e = [1,2,3].length
}

any类型

说明

any表示任意值类型，用于为一个不清楚类型的变量指定一个类型。 相当于ts中对该变量关闭了ts类型检查，可以被赋值或赋值给任意类型的变量，且不会报错

常见使用情况

1. 变量的值会动态改变时

如用户的输入，任意值类型可以让这些变量跳过编译阶段的类型检查

ts
let condition:any = 10
console.log(condition,condition.constructor)//10 ƒ Number() { [native code] }

condition = "1"
console.log(condition,condition.constructor)//1 ƒ String() { [native code] }

condition = true
console.log(condition,condition.constructor)//true ƒ Boolean() { [native code] }

2. 改写现有代码时，任意值允许在编译时可选择地包含或移除类型检查

• 更改现有代码，普通类型
  

• 更改现有类型，任意类型
  

unknown类型

说明

可以把任何值赋值给unknown，但是在对unknown类型的值执行大多数操作之前，必须进行某种形式的检查

注意点

any和unknown都是顶级类型，但是unknown更加严格，不像any那样不做类型检查，反而unknown因为未知性质，不允许访问属性，不允许赋值给其他有明确类型的变量

若是要访问熟悉和方法，需要采用类型断言和类型保护

如果联合类型中有unknown，那么最终得到的都是unknown类型

Eg

let value:unknown;
value = 'hello';
(value as string).length

....

let value:unknown;
value = 'hello';
if (typeof value === 'string') {
  value.length
}

void类型

说明

空值，表示没有任何类型；
当一个函数没有返回值，通常会见到其返回值类型是void

Eg

ts
// void类型  
function alertmsg():void {
    alert("this is msg")
}

声明一个void类型的变量后，只能为其赋予undefined和null

let unusable: void = undefined

never

说明

never是任何类型的子类型，也可以赋值给任意类型；表示那些永不存在的值的类型
意味着声明为 never 类型的变量只能被 never 类型所赋值，在函数中它通常表现为抛出异常或无法执行到终止点（例如无限循环）

// 返回never的函数必须存在无法达到的终点
function error(message: string): never {
    throw new Error(message);
}

// 推断的返回值类型为never
function fail() {
    return error("Something failed");
}

// 返回never的函数必须存在无法达到的终点
function infiniteLoop(): never {
    while (true) {
    }
}