【JavaScript】数组简介

数组的创建

字面量创建数组

const arr = [12, 34, 45, 56, 67];

数组的元素可以为任意类型的数据：

const arr = [1, 'superman', true, undefined, null];

注意：如果 , 之间没有写入数据，默认为 empty，输出为 undefined。

const arr = [1, , 2];
console.log(arr); // [1, empty, 2]
console.log(arr[1]); // undefined

构造函数创建数组

创建空数组：

const arr = new Array();
console.log(arr); // []

创建指定内容的数组：

const arr2 = new Array('6'); // 传入字符串参数
console.log(arr2); // ["6"]

const arr1 = new Array(1, 2, 3, 4);
console.log(arr1); // [1, 2, 3, 4]

创建指定长度的数组：

const arr = new Array(6); // 传入数字参数
console.log(arr); // [empty × 6]

数组的操作

获取元素

可以通过下标 ( 索引 ) 获取数组中的某一项，下标从0 开始：

const arr = [12, 34, 45, 56, 67];
console.log(arr[0], arr[1], arr[4]); // 12 34 67

添加/更新元素

const arr = [];
console.log(arr); // []
arr[0] = 1; // 添加数据
console.log(arr); // [1]
arr[0] = 2; // 更新数据
console.log(arr); // [2]

数组的类型

数组是 “由数字属性名和属性值组成键值对、且有 length 属性的” 特殊对象，我们称数组的属性名为索引。

const arr = [12, 34, 45, 56, 67];
console.log(typeof arr); // object

因为数组为引用类型数据，所以使用运算符操作数组时 被操作的其实是数据的存储地址。

const a = [1, 2, 3, 4];
const b = a;
b[0] = 88;
console.log(a[0], b[0]); // 88 88

因为运算符操作的是内存地址，所以不能直接用 == 比较数组：

const a = [1, 2, 3, 4];
const b = a;
console.log(a == b); // true

const a = [1, 2, 3];
const b = [1, 2, 3];
console.log(a == b); // false

数组的遍历

可以使用 for 循环遍历数组，通过索引获取对应的值：

const arr = [10, 20, 30];
const len = arr.length; // 把长度保存起来再使用, 效率会高一丢丢
for (let index = 0; index < len; index++) {
    console.log(arr[index]); // 10 20 30
}

也可以使用 for … in 遍历数组：

const obj = ['a', 'b', 'c'];
for (let key in obj) {
    // key → 数组的索引
    console.log(key, obj[key]); // 0 a  1 b  2 c
}

数组的属性

数组只有一个属性 —— length，表示数组的长度。

const arr = [10, 20, 30, 40, 50];
console.log(arr.length); // 5

注意：数组的下标是从 0 开始，所以最后一项的下标为 arr.length - 1。

const arr = [10, 20, 30, 40, 50];
console.log(arr[arr.length - 1]); // 50

如果我们使用的下标大于 arr.length - 1，则会输出 undefined。

let arr = [10, 20, 30, 40, 50];
console.log(arr[arr.length]); // undefined

如果我们给下标大于 arr.length - 1 的项赋值，则会拉长数组的长度。

let arr = [10, 20, 30, 40, 50];
arr[9] = 100;
console.log(arr); // [10, 20, 30, 40, 50, empty × 4, 100]

所以，我们可以通过 arr.length 在数组末尾添加新数据：

let arr = [10, 20, 30, 40, 50];
arr[arr.length] = 100;
console.log(arr); // [10, 20, 30, 40, 50, 100]

如果我们改变属性 length 的值，则会改变数组：

1. 改小 length：

let arr = [10, 20, 30, 40, 50];
arr.length = 0; // 清空数组
console.log(arr); // []

2. 改大 length：

let arr = [10, 20, 30, 40, 50];
arr.length = 10;
console.log(arr); // [10, 20, 30, 40, 50, empty × 5]

相关知识：

1. 【JavaScript】数组实例方法 (ES5)
2. 【JavaScript】高阶数组实例方法 (ES5)
3. 【JavaScript】数组方法 (ES6)