TypeScript 数组和元组

xiaofanguan 2020-05-29

/**
* TS 数组和 JS 数组是一样的
* 变量提示,const numberArr: number[]
*/
const numberArr = [1, 2, 3];

const arr: number[] = [1,2,3];
const stringArr: string[] = [‘a‘, ‘b‘, ‘c‘];
// 如果这个数组里面既存数字又存字符串,如何写
const arr1: (number | string)[] = [1, ‘2‘ ,3];


// 除了基本类型的数组,对象类型的数组怎么写
const objectArr: {name: string, age: number}[] = [{name:‘a‘, age:16}]
// 将上面的写法简化下,利用 type alias 类型别名
type User = {name: string, age: number}
const objectArr1: User[] = [{name:‘a‘, age:16}]


// 元组 tuple
const teacherinfo = [‘zina‘, ‘girl‘, 18];
/**
* 鼠标悬浮变量
* const teacherinfo: (string | number)[],
* 推断出 teacherinfo 里面存储的值可能是 string, 也可能是 number
*/
const teacherinfo1: (string | number)[] = [‘zina‘, ‘girl‘, 18];
/**
* 如果说后面的这个数组,长度肯定只有三个,
* 第一个肯定是字符串,第二个肯定是字符串,第三个肯定是数字
* 这个时候第一个改成数字不会报错,数组这种类型约束已经约束不到了
* 这个时候元祖的作用就显现了
*/
const teacherinfo2: [string, string, number] = [‘zina‘, ‘girl‘, 18];
/**
* 这种就是元祖的写法,这个时候后面加一个,或者改动三者的类型都会报错
* 一个数组里面的长度和类型都是固定的时候,就可以使用元祖
* 场景:读取 excel csv 的时候
*/
const teacherinfo3: [string, string, number][] = [
[‘zina‘, ‘girl‘, 18],
[‘zina‘, ‘girl‘, 18],
[‘zina‘, ‘girl‘, 18]
];

相关推荐

蜗牛慢爬的李成广 / 0评论 2020-01-28