数组对象的作用是使用单独的变量名来存储一系列不限类型的值。

创建数组

常规方式

1
2
3
4
var myCars=new Array(); 
myCars[0] = "Saab";
myCars[1] = "Volvo";
myCars[2] = "BMW";

简洁方式

1
var myCars = new Array("Saab","Volvo","BMW");

字面

1
var myCars = ["Saab","Volvo","BMW"];

访问数组

通过指定数组名以及索引号码,你可以访问或修改某个特定的元素。

1
2
3
4
5
var myCars = ["Saab","Volvo","BMW"];
console.log(myCars[0]); // 输出:Saab

myCars[1] = "Benz";
console.log(myCars); // 输出:["Saab","Benz","BMW"]

数组属性和方法

数组长度(数组中元素数量)

1
2
var myCars = ["Saab","Volvo","BMW"];
console.log(myCars.length); // 3

指定元素在数组中的位置

1
2
var myCars = ["Saab","Volvo","BMW"];
console.log(myCars.indexOf("Volvo")); // 1

判断是否为数组

1
2
3
4
var arr = [];
var json = {};

console.log(Array.isArray(arr), Array.isArray(json)); // true false

数组转换为字符串

下列方法不会改变原数组。

1
2
3
4
5
6
7
8
var num = [1, 2, 3];
var str1 = num.toString();
var str2 = num.join();

// Object.prototype.toString.call() 可检测任意数据类型
console.log(Object.prototype.toString.call(str1), Object.prototype.toString.call(str1)); // [object String] [object String]

console.log(str1===str2); // true

数组排序

下列方法改变原数组。

1
2
3
4
5
6
7
8
9
10
11
var num = [2, 1, 5, 4, 6, 3];

// 反序原数组
var num1 = num.reverse();

console.log(num, num1) // [3, 6, 4, 5, 1, 2] [3, 6, 4, 5, 1, 2]

// 正向排序数组
var num2 = num.sort();

console.log(num, num1, num2); // [1, 2, 3, 4, 5, 6] [1, 2, 3, 4, 5, 6] [1, 2, 3, 4, 5, 6],都指向 num

累加器

下列方法不会改变原数组。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
var num = [1, 2, 3, 4, 5, 6];

// 从左至右累加
var result = num.reduce((total, item) => {
console.log(`total:${total} -- item:${item} -- result:${total+item}`);
return total + item
})
/**
* total:1 -- item:2 -- result:3
* total:3 -- item:3 -- result:6
* total:6 -- item:4 -- result:10
* total:10 -- item:5 -- result:15
* total:15 -- item:6 -- result:21
*/

// 从右至左累加
var result1 = num.reduceRight((total, item) => {
console.log(`total:${total} -- item:${item} -- result:${total+item}`);
return total + item
})
/** total:6 -- item:5 -- result:11
* total:11 -- item:4 -- result:15
* total:15 -- item:3 -- result:18
* total:18 -- item:2 -- result:20
* total:20 -- item:1 -- result:21
*/

console.log(result, result1) // 21 21

数组过滤

下列方法不会改变原数组。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
var num = [1, 2, 3, 4, 5, 6];

// 从 num 中获取一个大于 3 的数组
var num1 = num.filter(item => item>3);

// 从 num 中获取小于 4 的第一个元素
var num2 = num.find(item => item<4);

// 从 num 中获取小于 4 的第一个元素的索引
var num3 = num.findIndex(item => item<4);

// 从 num 中获取 2 元素的索引
var num4 = num.indexOf(2);

// 从 num 中获取 2 元素最后一次出现的索引
var num5 = num.lastIndexOf(2);

// 判断 num 数组中是否所有元素都大于 4
var judgement = num.every(item => item>4); // false

// 判断 num 数组中是否含有元素大于 4
var judgement1 = num.some(item => item>4); // true

// 判断 num 中是否有 1 元素
var judgement2 = num.includes(1); // true

console.log(num, num1, num2, num3, num4, num5, judgement, judgement1, judgement2); // [1, 2, 3, 4, 5, 6] [4, 5, 6] 1 0 1 1 false true true

连接多个数组

下列方法不会改变原数组。

1
2
3
4
5
6
var num1 = [1, 2];
var num2 = [3];
var num3 = [4, 5, 6];
var num4 = num1.concat(num2,num3);

console.log(num1, num2, num3, num4) // [1, 2] [3] [4, 5, 6] [1, 2, 3, 4, 5, 6]

添加元素至数组

下列方法改变原数组。可添加任意数量。

1
2
3
4
5
6
7
8
9
var num = [3, 4, 5];

// 推送至首位
var length1 = num.unshift(1, 2);

// 推送至末位
var length2 = num.push(6);

console.log(num, length1, length2); // [1, 2, 3, 4, 5, 6] 5 6

删除数组中的元素

下列方法改变原数组。每次仅可删除一个。

1
2
3
4
5
6
7
8
9
var letter = ["a", "b", "c", "d", "e", "f"];

// 删除首位元素
var element1 = letter.shift();

// 删除末位元素
var element2 = letter.pop();

console.log(letter, element1, element2); // ["b", "c", "d", "e"] "a" "f"

数组截取替换

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
var letter = ["a", "b", "c", "d", "e", "f"];

// slice(start, end);start <= 取值 < end,不改变原数组
var letter1 = letter.slice(0, 2);

// 负数代表倒数,-1 为 e,-3 为 c
var letter2 = letter.slice(-3, -1);

// slice(start);start <= 取值 < 末尾
var letter3 = letter.slice(letter.length-1);

console.log(letter,letter1,letter2,letter3); // ["a", "b", "c", "d", "e", "f"] ["a", "b"] ["d", "e"] ["f"]

// ******************************************************

var letter = ["a", "b", "c", "d", "e", "f"];

// 万能数组操作方法,会改变原数组
// splice(start, deleteNum, addElements),从 start 位置删除 deleteNum 个,在 start 位置前添加 addElements

// 给 a 之前增加元素
var letter1 = letter.slice(0);
letter1.splice(0, 0, "g", "g");

// 删除 a 和 b
var letter2= letter.slice(0);
letter2.splice(0, 2);

// 修改 b 为 bb
var letter3 = letter.slice(0);
letter3.splice(1, 1, "bb");

console.log(letter,letter1,letter2,letter3); // ["a", "b", "c", "d", "e", "f"] ["g", "g", "a", "b", "c", "d", "e", "f"] ["c", "d", "e", "f"] ["a", "bb", "c", "d", "e", "f"]

数组遍历

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
var letter = ["a", "b", "c", ""];
var feArr = [],
mpArr = [];

// forEach 遍历数组
var forEachArr = letter.forEach((item, index) => {
feArr.push(index+item);
return index+item;
});

// map 遍历数组
var mapArr = letter.map((item, index) => {
mpArr.push(index+item);
return index+item;
});

console.log(letter, feArr, forEachArr, mpArr, mapArr);
// ["a", "b", "c", ""] ["0a", "1b", "2c", "3"] undefined ["0a", "1b", "2c", "3"] ["0a", "1b", "2c", "3"]

数组深拷贝

数组为指向型数据。

1
2
3
4
5
6
7
8
9
10
11
12
var num = [1, 2, 3];

//声明的 num1 指向 num,即修改 num 或 num1 任何一个,都会两个一起改变
var num1 = num;

num[0] = 0;

console.log(num,num1); // [0, 2, 3] [0, 2, 3]

num1[0] = 4;

console.log(num, num1); // [4, 2, 3] [4, 2, 3]

slice(0)

1
2
3
4
5
6
7
8
9
10
11
12
var num = [1, 2, 3];

//截取一个数组,从初始位置到结束
var num1 = num.slice(0);

num[0] = 0;

console.log(num,num1); // [0, 2, 3] [1, 2, 3]

num1[0] = 4;

console.log(num, num1); // [0, 2, 3] [4, 2, 3]

concat()

1
2
3
4
5
6
7
8
9
10
11
12
var num = [1, 2, 3];

//声明的 num1 指向 num,即修改 num 或 num1 任何一个,都会两个一起改变
var num1 = num.concat();

num[0] = 0;

console.log(num,num1); // [0, 2, 3] [0, 2, 3]

num1[0] = 4;

console.log(num, num1); // [0, 2, 3] [4, 2, 3]

[…[]]

1
2
3
4
5
6
7
8
9
10
11
12
var num = [1, 2, 3];

//声明的 num1 指向 num,即修改 num 或 num1 任何一个,都会两个一起改变
var num1 = [...num];

num[0] = 0;

console.log(num,num1); // [0, 2, 3] [0, 2, 3]

num1[0] = 4;

console.log(num, num1); // [0, 2, 3] [4, 2, 3]