typeScript-数组类型
数组类型
在TypeScript中,数组的定义方式有多种,比较灵活。
「类型+方框号」表示法
最简单的方法是试用「类型+方框号」表示数组
let arr : number[] = [1,2,3,4]
如果规定了其数组类型,数组项中不允许出现其他类型的,否则报错
let arr : number = [1,2,3,4]
arr[4] = '234
// ERROR in
// TS2322: Type 'string' is not assignable to type 'number'.
数组的一些方法的参数也会根据数组在定义时约定的类型进行限制
let arr : number[] = [1,23,4]
arr.push('232')
// ERROR in
// TS2345: Argument of type 'string' is not assignable to parameter of type 'number'.
上例中,push方法只允许传入number类型的参数,但是却传了一个string类型的参数,因此报错了
数组泛型
我们也可以使用数组泛型(Array Generic) Array
let arr2 :Array<number> = [1,2,3,4]
用接口也可以表示数组
interface NumberArray {
[index:number] :number
}
let arr2 :NumberArray = [1,2,3,4]
NumberArray接口表示只要索引的类型是数字时,那么值的类型必须是数字,虽然接口也可以用来描述数组,但是通常我们不会这样做,因为这种方式比前面两种方式复杂得多。
使用上面代码中的arr2.调用push方法,会报错
arr2.push(3)
// ERROR in
// TS2339: Property 'push' does not exist on type 'NumberArray'.
接口上并没有定义push方法,因此会报错
但是通常,会用类似的方法定义类数组
类数组
对于一个普通对象来说,如果它的所有的property都为正整数,同时也具有相应的length属性,虽然该对象并不是由Array构造函数创建出来的,但是它依然呈现出数组的的行为,这样的情况下,这样的对象被称为"类数组"对象
类数组对象是具有以下两点的对象
- 拥有length属性,其他属性(索引)为非负整数
- 不具有数组所拥有的方法
function sum () {
let args:number[] = arguments
}
// ERROR in
// TS2740: Type 'IArguments' is missing the following properties from type 'number[]': pop, push, concat, join, and 24 more.
上例中,arguments不是一个真正的数组,而是一个类数组,类数组不存在数组的方法,因此会报错
在JavaScript中,我们可以通过Function.length来访得到函数签名中参数的个数(形参个数),如果要知道实参个数,在非箭头函数中,我们可以通过函数内部局部变量arguments得知,它是一个类数组
用接口来表示类数组
function sum () {
let args:{
[index:number]:number,
length:number,
callee:Function
} = arguments
}
在这个例子中,我们除了约束了当索引类型的为数字,值的类型必须是数字之外,也约束了它还有length和callee两个属性。
事实上,常用的类数组都有自己的接口定义,如IArguments
,NodeList
,HTMLCollection
等
function sum1 () {
let args:IArguments = arguments
}
其中 IArguments 是 TypeScript 中定义好了的类型,它实际上就是:
interface IArguments {
[index: number]: any;
length: number;
callee: Function;
}
any在数组中的应用
一个比较常见的做法是,用 any 表示数组中允许出现任意类型:
let list: any[] = ['xcatliu', 25, { website: 'http://xcatliu.com' }];