Array对象

2017-02-25

摘要：JavaScript中的数组总结

认识数组

JavaScript中的数组属于动态数组，即定以后可以修改数组长度
从数组的下标类型可以分为索引数组、关联数组。索引数组即下标从0开始递增，关联数组的索引则为指定的字符串
数组的元素：
1.数组内可以存放任意类型的数据
2.数组元素不赋值，则是undefined
3.遍历数组时，如果某个元素没有赋值就会跳过
4.访问数组范围以外的元素时，不会出现越界异常，为undefined；
5.定义的数组很小，依然能够添加更多的元素

数组的创建

创建数组的基本方式有两种：

// 使用 Array 构造函数，new 可省略
var arrayA = new Array(); // 无参数时创建一个空数组
var arrayB = Array(10); // 单个正整数表示新数组的长度
console.log(arrayB.length) // 10
console.log(arrayB[0]); // undefined,未赋值均为undefined
var arrayC = Array(1, "blue", [2], true); // 多参数时，所有参数都是新数组成员
arrayC["name"] = "niuxiaokui";
arrayC["age"] = 24;
console.log(arrayC); // [1, "blue", [2], true, name: "niuxiaokui", age: 24];
console.log(arrayC["name"]); // "niuxiaokui"

// 使用数组字面量表示法
var arrayD = []; // 创建一个空数组
var arrayE = [1, "blue", [2], true];
arrayE.length = 3; // 修改数组的length属性，可以从数组的末尾移除项或添加新项
console.log(arrayE); // [1, "blue", [2]]

数组检测

Array.isArray 方法判断是否为数组

1 2	var arr = [1, 2, 3]; Array.isArray(arr) // true

实例方法

会改变原数组的方法：
1.push 方法向数组末端添加元素，返回新数组长度

1
2
3

var arr = [1, true, "string"];
arr.push(1, false);
console.log(arr); // [1, true, "string", 1, false]

2.pop 方法删除数组最后一个元素并返回该元素

var arr = [1, true, "string", 1, false];
var a = arr.pop();
console.log(a); // false
console.log(arr); // [1, true, "string", 1]

3.shift 方法删除数组第一个元素并返回该元素

var arr = [1, true, "string", 1];
var b = arr.shift(); // 1
console.log(b); // false
console.log(arr); // [true, "string", 1]

4.unshift 方法在数组首部添加元素，返回新数组长度

var arr = [true, "string", 1];
var c = arr.unshift(2, false);
console.log(c); // 5
console.log(arr); // [2, false, true, "string", 1]

5.reverse 方法颠倒数组中元素的顺序

1
2
3

var arr = [2, false, true, "string", 1];
arr.reverse();
console.log(arr); // [1, "string", true, false, 2]

6.splice 方法删除原数组一部分元素，并可以在删除的位置上添加新元素，返回被删除的元素，可以操作数组删除、替换、插入元素。不传递第二个参数，则删除从起始索引到数组结尾所有元素

// splice(起始索引[, 截取个数, 插入的任意个元素])
var arr = [1, "string", true, false, 2];
var d = arr.splice(1, 2); // 删除（截取）
console.log(arr); // [1, false, 2]
console.log(d); // ["string", true]
var e = arr.splice(1, 1, true, "string"); // 替换
console.log(arr); // [1, true, "string", 2]
console.log(e); // [false]
var f = arr.splice(1, 0, 3); // 插入
console.log(arr); // [1, 3, true, "string", 2]
console.log(f); // []

7.sort 方法对数组成员进行排序，默认按照字典顺序排序

var arr = [1, 2, 3, 11, 12, 21, 43, 78, 100, 101];
arr.sort();
console.log(arr); // [1, 100, 101, 11, 12, 2, 21, 3, 43, 78]
arr.sort(function(a, b){
	return a - b; // 从小到大排序
})
console.log(arr); // [1, 2, 3, 11, 12, 21, 43, 78, 100, 101]
arr.sort(function(a, b){
	return b - a; // 从大到小排序
})
console.log(arr); // [101, 100, 78, 43, 21, 12, 11, 3, 2, 1]

不会改变原数组的方法：
1.valueOf 方法返回数组本身

1
2
3

var arr = [1, true, "string"];
var valueOf = arr.valueOf();
console.log(valueOf); // [1, true, "string"]

2.toString 方法返回数组元素之间添加逗号合并成的字符串

1 2	var toString = arr.toString(); console.log(toString); // "1,true,string"

3.join 方法以参数为分隔符将数组成员组成字符串返回

var join1 = arr.join();
console.log(join1); // "1,true,string"
var join2 = arr.join("+");
console.log(join2); // "1+true+string"

4.concat 方法连接一个或多个数组的成员，并返回新数组，原数组不变。如果参数不是数组，就将值依次添加到数组末尾

1 2	var concat = arr.concat(4, 5, ["Object", "Number", [false, "length"]]); console.log(concat); // [1, true, "string", 4, 5, "Object", "Number", [false, "length"]]

5.slice 方法用于提取原数组的一部分返回一个新数组，可以将类似数组的对象（拥有 length 属性如函数的 arguments 对象、大多数 DOM 元素集、字符串）转为真正的数组

// slice([起始索引[, 截止索引]]) 起始索引默认为 0，但不包含截止索引上的元素，如果索引位置上是负数，则应该加上数组长度
var slice1 = arr.slice(1);
console.log(slice1); // [true, "string"]
var slice2 = arr.slice(0, 1);
console.log(slice2); // [1]
var slice3 = arr.slice(-3, -2); // 等同于 arr.slice(0, 1)
console.log(slice2); // [1]

6.indexOf 方法返回在该数组中第一个找到的元素位置，如果它不存在则返回 -1，第一个参数是要查找的元素，第二个可选参数是查找的起始索引，如果索引负数，则应该加上数组长度

var arr = [1, 2, 2, 3];
var ind1 = arr.indexOf(2);
var ind2 = arr.indexOf(2, 2);
var ind3 = arr.indexOf(2, -2); // 同 arr.indexOf(2, 2)
console.log(ind1); // 1
console.log(ind2); // 2
console.log(ind3); // 2

7.lastIndexOf 与 indexOf 相似，只不过他是从后向前查找

var arr = [1, 2, 2, 3];
var ind1 = arr.lastIndexOf(2);
var ind2 = arr.lastIndexOf(2, 2);
var ind3 = arr.lastIndexOf(2, -2); // 同 arr.lastIndexOf(2, 4-2)
console.log(ind1); // 2
console.log(ind2); // 2
console.log(ind3); // 2

8.forEach 方法遍历数组所有成员不能中断跳出，无返回值

arr.forEach(function(value, index, arr){ // 值，索引，数组本身
	console.log(value, index, arr);
})
// 1 0 [1, true, "string"]
// true 1 [1, true, "string"]
// string 2 [1, true, "string"]

9.map 方法对数组成员依次调用一个函数，根据函数结果返回一个新数组

var map = arr.map(function(value, index, arr){
	return value + "map"; // 所有元素拼接字符串
})
console.log(map); // ["1map", "truemap", "stringmap"]

10.filter 方法的参数是一个函数，所有数组成员依次执行该函数，返回结果为 true 的成员组成一个新数组

var filter = arr.filter(function(value, index, arr){
	return index % 2 === 0; // 返回索引是偶数的元素
})
console.log(filter); // [1, "string"]

11.some 方法接收一个函数微参数，所有成员依次执行该函数，返回一个布尔值，只要有一个为 true，该方法就返回 true

var some0 = arr.some(function(value, index, arr){
	return value === 0; // 元素值为0返回true
})
var some1 = arr.some(function(value, index, arr){
	return value === 1; // 元素值为1返回true
})
console.log(some0); // false
console.log(some1); // true

12.every 方法类似 some 但要所有成员返回的都是 true，该方法才返回 true

var every0 = arr.every(function(value, index, arr){
	return value !== 0; // 元素都不为0返回true
})
var every1 = arr.every(function(value, index, arr){
	return value !== 1; // 元素都不为0返回true
})
console.log(every0); // true
console.log(every1); // false

13.reduce 方法从左到右依次处理数组每个成员，最终累计为一个值。第二个参数是初始值 prev，不设置初始值 index 从 1 开始，否则从 0 开始

var arr = [1, 2, 3, 4, 5];
var sum = arr.reduce(function(prev, value, index, arr){ // 第一项/上一次结果，当前值，当前索引，数组对象本身
	console.log(prev, value, index);
	return prev + value;
})
// 1 2 1
// 3 3 2
// 6 4 3
// 10 5 4
console.log(sum); // 15

14.reduceRight 方法与 reduce 类似，但它是从右到左依次处理数组每个成员，最终累计为一个值

var arr = [1, 2, 3, 4, 5];
var sum = arr.reduceRight(function(prev, value, index, arr){ // 最后一项/上一次结果，当前值，当前索引，数组对象本身
	console.log(prev, value, index);
	return prev + value;
})
// 5 4 3
// 9 3 3
// 12 2 1
// 14 1 0
console.log(sum); // 15

《JavaScript高级程序设计》（第三版）第5章引用类型
Array 对象