JavaScript - Array

JavaScript 中的对象是指带有属性和方法的特殊数据类型。JavaScript 中的所有事物都是对象,比如字符串、数组、函数等。对象分为内置对象和原生对象,它们的区别在于:前者总是在引擎初始化阶段就被创建好的对象,是后者的一个子集;而后者包括了一些在运行过程中动态创建的对象。从语法层面来看的话,原生对象需要使用 new 创建,而内置对象则不需要。

JavaScript 常见的内置对象有:ArrayStringMathDate 几种。

Array 的元素可以是任意的类型。Array 的创建有两种方式,使用构造函数:

1
2
3
4
5
6
//构造函数创建数组
var nums = new Array();
//指定数组的长度
var colors = new Array(10);
//指定数组包含的项
var arr = new Array(1, 2, 3, 4);

或者使用字面量来创建数组:

1
2
3
4
var a = 'a';
var b = true;
var c = 100;
var chars = [a, b, c];

读写

Array 的取值和赋值可以通过 [] 进行。如:

1
2
3
4
5
6
7
8
9
10
11
var chars = ['a', 'b', 'c'];
var a = chars[0];
var f = chars[5];
console.log(a, f); //log: a undefined
var upperChars = new Array(10);
console.log(upperChars.length); //log: 10
var z = 'Z';
upperChars[24] = z;
console.log(upperChars.length); //log: 25
console.log(upperChars[24], upperChars[2]); //log: Z undefined

上面的代码说明,Array 可以灵活的改变长度,越界和未赋值的部分,都是 undefined

栈方法

栈方法,顾名思义,就是把数组当做栈来处理,也就是先进先出的原则。主要有以下几个方法:

push

1
2
3
4
var chars = ['a', 'b', 'c'];
chars[24] = 'z';
var len = chars.push(1, 2, 3);
console.log(len); //log: 28

push 的作用是将元素序列添加到 Array 的尾部,其返回值是添加后的数组长度。

pop

1
2
3
4
var chars = ['a', 'b', 'c'];
var c = chars.pop()
var len = chars.length;
console.log(c, len); //log: c 2

pop 的作用是移除 Array 的最后一个元素,其返回值是被移除的元素。

unshift

1
2
3
4
5
6
var chars = [1, 2, 3];
var len = chars.unshift(-3, -2, -1, 0);
console.log(chars);
//log: [-3, -2, -1, 0, 1, 2, 3]
console.log(len);
//log: 7

unshift 的作用是将元素序列添加到 Array 的头部,其返回值是添加后的数组长度。

shift

1
2
3
4
var chars = [];
var unknown = chars.shift()
var len = chars.length;
console.log(unknown, len); //log: undefined 0

pop 的作用是移除 Array 的第一个元素,其返回值是被移除的元素。

转字符串

join 方法可以将 Array 转换成一个字符串,语法如下:

1
2
3
4
5
6
7
8
var infos = [1, '2', true, 3.14, undefined, null];
var infoStr = infos.join();
console.log(infoStr);
//log: 1,2,true,3.14,,
console.log(infos.join('-'));
//log: 1-2-true-3.14--
console.log(infos.join(''));
//log: 12true3.14

反序

reverse 方法可以将 Array 反序排列,如下:

1
2
3
4
var nums = [2, 4, 6, 8,];
var result = nums.reverse();
console.log(result);
//log: [8, 6, 4, 2]

排序

sort 方法可以根据传入的参数,对 Array 进行排序:

1
2
3
4
var chars = ['e', 'z', 'p', 'o', 'a', 'c'];
var result = chars.sort();
console.log(result);
//log: ["a", "c", "e", "o", "p", "z"]

需要注意的是,sort 方法在对数值进行排序时,也是先将元素转为 String 类型在排序,因此,数值的排序是按首位排序,首位相同再对第二位进行比较:

1
2
3
4
var nums = [9, -1, 3.24, 3.3, 2, 0, 25.6, 25.9, 24.8, 'A', 'a', 'z', 'Z'];
var result = nums.sort();
console.log(result);
//log: [-1, 0, 2, 24.8, 25.6, 25.9, 3.24, 3.3, 9, "A", "Z", "a", "z"]

如果需要对数值进行排序,那么需要给 sort 传入一个匿名函数:

1
2
3
4
var nums = [9, -1, 3.24, 3.3, 2, 0, 25.6, 25.9, 24.8];
var result = nums.sort(function(a, b){ return a > b});
console.log(result);
//log: [-1, 0, 2, 3.24, 3.3, 9, 24.8, 25.6, 25.9]

连接其他数组

concat 方法用于两个或多个数组的连接:

1
2
3
4
5
6
var a = [1, 2, 3];
var b = [4, 5, 6];
var c = [7, 8, 9];
var arr = a.concat(c, b);
console.log(arr);
//log: [1, 2, 3, 7, 8, 9, 4, 5, 6]

截取

1
2
3
4
var arr = [1, 2, undefined, null, 3, 4, 5];
var subArr = arr.slice(2,10);
console.log(subArr);
//log: [undefined, null, 3, 4, 5]

slice 方法越界,会截取所有在此范围内的元素。slice 方法可以接受两个参数,startend,其中 start 是必需的,start 参数可以是负数,如果是负数,表示从数组尾部开始计算。

1
2
3
4
var arr = [1,2,3,4,5];
var subArr = arr.slice(-3,-1);
console.log(subArr);
//log: [3, 4]

slice 方法的参数是负数时,会用数组的长度加上这个数,来确定起始或结束的位置。

删除、插入和替换

删除的语法是 arr.splice(index,count),参数含义如下:

形参 含义
index 要删除的起始位置
count 要删除的元素个数

count 如不填,则删除 index 后的所有元素,如为 0,则不删除任何元素,示例如下:

1
2
3
4
5
6
var arr = [1,2,3,4,5,6];
var subArr = arr.splice(2,3);
console.log(subArr);
//log: [3, 4, 5]
console.log(arr);
//log: [1, 2, 6]

splice 的返回值是被删除的数组片段。

插入的语法是 arr.splice(index,0,item1,...,itemX),返回值是空数组;

替换的语法是 arr.splice(index,count,item1,...,itemX),返回值是被删除的数组片段;

查找元素下标

indexOf 方法用于查找元素在数组中的位置,可以接收两个参数:

形参 含义
searchValue 必需,要查找的元素
startIndex 可选,索引的起始位置,不填则从 0 开始

返回值是 Number 类型,如未找到该元素,则返回 -1,如有多个元素,则返回第一个元素的下标:

1
2
3
4
var arr = [1,3,5,7,5,3,1,3];
var index = arr.indexOf(3,4);
console.log(index);
//log: 5

lastIndexOf 方法和 indexOf 作用相同,不同的地方是从数组末尾开始查找。