TypeScript学习（五）：数组的定义方式及常见数组操作方法使用

上一篇我们提到了在typescript中对于对象的定义和使用，俗话说"万物皆对象"，这里我们就来说一下另一个特别的对象---数组。

在网上有很多对于数组的定义，例如：数组对象是使用单独的变量名来存储一系列的值，简单理解，我们可以说数组就是一组或者说是一系列数据的集合。

我们都知道，数组是我们在使用JavaScript开发中用到最多的类型之一，在JavaScript中，数组有以下两个主要特点：

• 数组内的数据可以是任意类型数据；

• 数组的长度没有任何限制；

在JavaScript中我们有以下常见的三种方式来定义数组：

// 方式1
var array = new Array();
array[0] = 1;
array[1] = 'string';
...

// 方式2
var array = new Array(1,'string');

// 方式3
var array = [1, 'string'];

在JavaScript中还有很多对于数组的操作方法，这里我就不多赘述了，前面的博客中我有写关于数组和对象遍历的一些方法，有兴趣的话可以查看交流一下（常见的遍历数组和对象的方法）；

说了那么多，我们现在来进入正题，那就是在typescript中，我们是如何来定义及使用数组的。

（1）第一种方式：类型 + []表示法

let array : number[] = [1, 2, 3];

需要注意的是，我们这里定义的方式，是不是跟之前的数据类型定义相似，均以冒号相隔，既然定义的方式二者类似，那么有些特性自然也就相似，那就是这种定义方式，限制了你要定义的数组中数据的数据类型，也就是说，我们上面定义的array : number[]，就表明在创建的数组array中，里面的数据类型只能是number类型或者是number类型的子类型，不允许有其它数据类型的数据存在，不然TS编译会报错。当然了，我们定义联合类型数组，这样就可以允许数组内存在我们想要的数据类型的数据，如下：

let array: (number | string)[] = [1, 2, 3, 'string']; // 允许数值和字符串类型

（2）第二种方式：接口

interface array {
    [index: number]: number
}
let arr: array = [1, 2, 3, 4, 5];

因为万物皆对象，所以我们也可以以定义对象的方式来定义数组。

在接口的定义方式中，我们可以看到我们使用了两个冒号的定义方式，从字面意思理解，也就是这个数组对象的类型中索引index值的数据类型是数值类型，同时数组内数据的数据类型也是数值类型。为什么我们要这样定义呢？来看以下代码：

interface array {
    [index: number]: number
}
let arr: array = [1, 2, 3, 4, '5'];

// 编译报错：Type 'string' is not assignable to type 'number'.

当我们限制了数据类型时，就不允许其它的数据类型进来了，同样，我们可以联合定义：

interface array {
    [index: number]: number | string
}
let arr: array = [1, 2, 3, 4, '5'];

但是使用接口定义数组的方法，在开发中用的是极少的，因为过程比较繁琐，下面的一种方式就是最常用的了。

（3）第三种方式：any

let arr: any[] = [1, 2, 3, 4, '5'];

方式三同样是利用了数据类型定义的特点，any也就是任意数组类型，所以我们可以在定义的数组中添加任意数据类型，这也是最常用的一种方式。

定义的方式我们说完了，下面介绍以下在JavaScript中常用的一些数组操作方式是如何在typescript中使用的：

// push,pull,shift,unshift
let arr: number[] = [1, 2, 3];
arr.push(4);  // 可以编译
arr.push('string');  // 编译报错：Argument of type '"string"' is not assignable to parameter of type 'number'.

我们可以看到，当定义好数组内的数据类型时，我们使用push ,pull ,shift ,unshift时，添加及删除的数据必须跟定义好的数据类型保持一致。

// concat的使用
let arr;
let arr_1: number[] = [1, 2, 3];
let arr_2: string[] = ['a', 'b', 'c'];
arr = arr_1.concat(arr_2); // 执行编译命令报错：'string[]' is not assignable to parameter of type 'ConcatArray<number>'

let arr;
let arr_1: number[] = [1, 2, 3];
let arr_2: number[] = [4, 5, 6];
arr = arr_1.concat(arr_2); // 执行编译指令成功

上述代码中是concat的使用方式，可以看到当我们将两个不同数据类型的数组进行拼接时，TS编译就会报错，所以我们可以理解为不同的两个数据类型的数组是不能执行拼接操作的。

 

 

到底啦！！！！！！！！！！！！！！！！