一、概述
在JavaScript声明数组时，可以不用指定数组的数据类型；而在TypeScript中，声明数组需要指定数据类型，如string、number等。今天小编就带大家一起来学习下TypeScript的声明，如果大家觉得有帮助，记得给小编点个赞，如果想获取更多干货请关注前端微服务公众号，不定期为大家带来干货。
二、使用场景
- 存储多个数据时，声明多个变量就太繁琐了。
- 数组，是用于存放多个数据的集合。
- 有数组：只需要使用一个数组（[]），就可以存储任意多个数据。
三、TypeScript 声明数组的语法
const array_name[:datatype]; //声明 array_name = [val1,val2,valn..] //初始化
或者直接在声明时初始化：
const array_name[:data type] = [val1,val2…valn]
如果数组声明时未设置类型，则会被认为是 any 类型，在初始化时根据第一个元素的类型来推断数组的类型。
const numberArr = [1,2,3];
四、使用案例
4.1 [数据类型 + 方括号] 表示法
// 数字类型 const numberArr: number[] = [1, 2, 3, 4]; // 字符串类型 const stringrArr: string[] = ['1', '2', '3']; //任意类型 const anyArr: any[] = [1, 'Poplar', 'Phoenix’]; //指定数组初始化大小 const arr_names:number[] = new Array(4) for(let i = 0; i<arr_names.length; i++) { arr_names[i] = i * 2 console.log(arr_names[i]) } // 直接初始化数组元素 const sites:string[] = new Array("Google","IE","Taobao","Facebook") for(let i = 0;i<sites.length;i++) { console.log(sites[i]) }
4.2 数组泛型
// 数字类型 let numberArrr: Array<number> = [1, 2, 3, 4]; // 字符串类型 const stringrArr: Array<string> = ['1', '2', '3']; //任意类型 const anyArr: Array<any> = [1, 'Poplar', 'Phoenix’];
4.3 用接口表示数组
/** * 数字类型(NumberArray表示只要inde值类型为number，那么值类型必须为number) */ interface NumberArray { [index: number]: number } let numberArrr: NumberArray = [1, 2, 3, 4]; // 字符串类型 interface StringArray { [index: number]: string } const stringrArr: StringArray = ['1', '2', '3']; //任意类型 interface AnyArray { [index: number]: any } const anyArr: AnyArray> = [1, 'Poplar', 'Phoenix’];
4.4 类数组
类数组(Array-like Object)不是数组类型。
参考网址(https://ts.xcatliu.com/basics/built-in-objects.html)
function sum(){let args: number[] = arguments; }
4.5 数组中对象类型的定义
const person: { name: string, age: Number }[] = [ { name: "张三", age: 18 }, { name: "李四", age: 28 }, ];
这种形式看起来比较麻烦，而且如果有同样类型的数组，写代码也比较麻烦，TypeScript 为我们准备了一个概念，叫做类型别名(type alias)。比如刚才的代码，就可以定义一个类型别名，定义别名的时候要以type关键字开始。现在定义一个Lady的别名。
type Person = { name: string, age: Number };
有了这样的类型别名以后，就可以把上面的代码改为下面的形式了。
const person:Person [] = [ { name: "张三", age: 18 }, { name: "李四", age: 28 }, ];
这样定义是完全起作用的，但我们扩展属性就会报错，这时候我们就用类来解决。
class Person { name: string; age: number; } const person: Person[] = [ { name: "张三", age: 18 }, { name: "李四", age: 28 }, ];
interface Person { (name: string, age: number): boolean; } let getPerson:Person = (name, age) => { return age > 20; } getPerson('xunzhaotech', 29)
bject定义
interface Person { name: string; age?: number|string; } let list: Person[] = [ { name: '王麻子' }, { name: '张三', age: 29 }, { name: '李四', age: '29' } ]
