TypeScript基础知识（3）数组类型元组类型枚举类型

本文链接：https://blog.csdn.net/m0_51207602/article/details/122927339

数组类型

常见写法

const arr1:Array<number> = [1,2,3]//表示纯数字组成的类型
const arr2:number[] = [1,2,3]//元素类型表示，同样表示纯数字组成的类型

这样的优势是什么？我们来看下下面的例子

function sum(...args){
    //判断是不是每个成员都是数字
    return args.reduce((prev,current)=>prev+current,0)
}

我们需要判断…arg每个成员是不是数字，需要写一些判断逻辑，但是只要我们声明类型就像下面这样一切问题就迎刃而解了。

function sum(...args:number[]){
    //不需要判断是不是每个成员都是数字
    return args.reduce((prev,current)=>prev+current,0)
}
//如果我们传入非数字就会报错
sum(1,2,3,'foo')//报错：类型“string”的参数不能赋给类型“number”的参数

元组类型

是一种特殊的数据结构，就是明确元素数量，以及每个元素类型的一个数组，可以使用类似数组字面量这种语法形式来定义这种类型

const tuple:[number,string]=[18,'zce'];
const age = tuple[0];
const name = tuple[1]
//也可以使用数组解构方式提取每个元素 const [age,name] = tuple

枚举类型

在我们应用开发时，会涉及到用某几个数值表示某几种状态
比如我们下面有一个文章对象，status表示不同的状态比如0表示草稿，1表示未发布，2表示已经发布了

const post = {
    title:'Hello TypeScript',
    const:'TypeScript is very good',
    status:0//status表示不同的状态
}

但是如果时间久了的话我们可能忘了我们表示的状态
在JavaScript中我们可能会使用对象去实现模拟枚举,例如下面

const PostStatus = {
    Draft : 0,
    Unpublished : 1,
    Published : 2
}
const post = {
    title:'Hello TypeScript',
    const:'TypeScript is very good',
    status:PostStatus.Draft//status表示不同的状态
}

而现在在TypeScript中有了enum数据类型类型来表示枚举，写法如下

enum PostStatus {
    //注意是等号
    Draft = 0,
    Unpublished = 1,
    Published = 2
}
const post = {
    title:'Hello TypeScript',
    const:'TypeScript is very good',
    status:PostStatus.Draft//status表示不同的状态
}

如果我们不指定值就会从0开始累加

enum PostStatus {
    //注意是等号
    Draft ,
    Unpublished ,
    Published 
}
const post = {
    title:'Hello TypeScript',
    const:'TypeScript is very good',
    status:PostStatus.Draft//status表示不同的状态
}

如果我们指定为字符串，所以如果是字符串枚举就需要每个去指定，但是字符串并不常见

enum PostStatus {
    Draft ='aaa',
    Unpublished = 'bbb' ,
    Published ='ccc'
}
const post = {
    title:'Hello TypeScript',
    const:'TypeScript is very good',
    status:PostStatus.Draft//status表示不同的状态
}

枚举类型有一个需要注意的点，就是枚举类型会入侵代码，就是影响我们TypeScript编译后的结果。
这是index.ts文件

export {}
enum PostStatus {
    Draft ='aaa',
    Unpublished = 'bbb' ,
    Published ='ccc'
}
const post = {
    title:'Hello TypeScript',
    const:'TypeScript is very good',
    status:PostStatus.Draft//status表示不同的状态
}

这是编译后的index.js文件

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var PostStatus;
(function (PostStatus) {
    PostStatus["Draft"] = "aaa";
    PostStatus["Unpublished"] = "bbb";
    PostStatus["Published"] = "ccc";
})(PostStatus || (PostStatus = {}));
const post = {
    title: 'Hello TypeScript',
    const: 'TypeScript is very good',
    status: PostStatus.Draft //status表示不同的状态
};

如果我们确定我们代码里面不会使用索引器类似：PostStatus【0】这种的，我们可以使用常量枚举
index.ts

export {}
const enum PostStatus {
    Draft ='aaa',
    Unpublished = 'bbb' ,
    Published ='ccc'
}
const post = {
    title:'Hello TypeScript',
    const:'TypeScript is very good',
    status:PostStatus.Draft//status表示不同的状态
}

编译后

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const post = {
    title: 'Hello TypeScript',
    const: 'TypeScript is very good',
    status: "aaa" /* Draft */ //status表示不同的状态
};