JS中数组的处理方法在IE8及之前的版本中，arr的值分别是 1、2和undefined，其他浏览器中arr的值为1、2

数组的处理方法有哪些？

一、创建数组的方式有两种：

1、使用Array构造函数：

var arr = new Array();
//如果预先知道数组元素的数量，可以传入该数量,此时数组中的元素数量为10个
var arr = new Array(10);

也可以向Array构造函数传入元素

var colors = new Array("red", "blue", "green");
//print
["red", "blue", "green"]

此外在使用Array构造函数时可以省略new操作符：

var arr = Array(10);

var colors = Array("red", "blue", "green");

2、使用数组字面量表示法：

var colors = ["red", "blue", "green"];//创建一个包含3个字符串的数组
var colors = [];//创建一个空数组

因为兼容性问题，不推荐的方法：

var arr = [1, 2, ];//创建一个包含2或者3项的数组，不推荐

var values = [,,,,,]//创建一个包含5或者6项的数组，不推荐

在IE8及之前的版本中，arr的值分别是 1、2和undefined，其他浏览器中arr的值为1、2。原因是IE8之前的ECMAScript实现在数组字面量方面存在bug。由于这个bug导致values可能会创建包含5项的数组（在IE9+，Firefox、Opera、Safari和Chrome中），也可能会创建包含6项的数组（在IE8及更早的版本中）。

二、ES5

1、栈方法：push()和pop()

push()方法可以接收任意数量的参数，逐个添加到数组末尾，返回修改后数组的长度。

var colors = [];
var count = colors.push("red", "blue", "green");
console.log(count); //3
console.log(colors); // ["red", "blue", "green"]
//同时可以通过索引添加值：
colors[3] = "black";
console.log(colors); // ["red", "blue", "green", "black"]

pop()方法是从数组末尾移除最后一项，减少数组的length，返回移除的项。

var colors = ["red", "blue", "green"];
var item = colors.pop();
console.log(item); //"green"
console.log(colors);//["red", "blue"]

2、队列方法：shift()和unshift()

shift()方法能够移除数组中的第一项并返回该项，同时数组长度减1。

var colors = ["red", "blue", "green"];
var item = colors.shift();
console.log(item); // "red"
console.log(colors); // ["blue", "green"]

unshift()方法和shift()相反，在数组前端添加任意项并返回新数组长度。

var colors = [];
var item = colors.unshift("red");
console.log(item); // 1
console.log(colors); // ["red"]

item = colors.unshift("blue", "green");
console.log(item); // 3
console.log(colors); // ["blue", "green", "red"]

3、排序方法：reverse()和sort()

reverse()方法用来反转数组。

var colors = ["red", "blue", "green"];
colors.reverse();
console.log(colors); // ["green", "blue", "red"]

sort()方法默认按升序排列数组。

var arr = [5, 4, 3, 2, 1];
arr.sort();
console.log(arr); // [1, 2, 3, 4, 5]

//如果需要对字符串进行排序呢？
var colors = ["red", "blue", "green"];
colors.sort();
console.log(colors); // ["blue", "green", "red"]
//对字符串进行sort排序，会把字符串转化为ASCII码，然后根据ASCII码来进行排序
console.log("blue".charCodeAt()); // 98
console.log("green".charCodeAt()); // 103
console.log("red".charCodeAt()); // 114

字符串比较可以使用localeCompare方法

"green".localeCompare("red"); // -1

"red".localeCompare("blue"); // 1

"10".localeCompare("10"); // 0

sort()方法可以接收一个比较函数作为参数，比较函数接收两个参数，如果第一个参数应该位于第二个之前则返回一个负数，反之则返回一个正数，如果两个参数相等则返回0。

//简单的比较函数,默认升序
function compare(value1, value2) {
  if (value1 < value2) {
    return -1;
  } else if (value1 > value2) {
    return 1;
  } else {
    return 0;
  }
}
var arr = [5, 4, 3, 2, 1];
arr.sort(compare);
console.log(arr); // [1, 2, 3, 4, 5]

//降序
function compare(value1, value2) {
  if (value1 < value2) {
    return 1;
  } else if (value1 > value2) {
    return -1;
  } else {
    return 0;
  }
}
//降序简写
function compare(value1, value2) {
  return value2 - value1
}
var arr = [1, 2, 3, 4, 5];
arr.sort(compare);
console.log(arr); // [5, 4, 3, 2, 1]

4、操作方法：concat()、slice()和splice()

concat()方法将接收的参数添加到数组的末尾。

var values = [];
var colors = ["red", "blue", "green"];
var mixArr = values.concat(colors);
console.log(mixArr); //["red", "blue", "green"]
console.log(values); // []

var final = mixArr.concat("red", ["orange", "black"]);
console.log(final); // ["red", "blue", "green", "red", "orange", "black"]

slice()方法接收一个或两个参数，即返回项的起始位置和结束位置，只有一个参数返回从指定参数位置到数组最后的所有项，有两个参数返回起始位置和结束位置之间的所有项。

var final = ["red", "blue", "green", "orange", "black"];
var colors = final.slice(1);
console.log(colors); // ["blue", "green", "orange", "black"]

var color = colors.slice(0, 1);
console.log(color); // ["blue"]

//如果slice()传入两个负数
var final = ["red", "blue", "green", "orange", "black"];
var color = arr.slice(-2, -1); // ["orange"]
var color2 = arr.slice(3, 4); // ["orange"]

splice()方法

删除：可以删除任意数量的项，需要2个参数：要删除第一项的索引和需要删除的个数。

var colors = ["red", "blue", "green", "orange", "black"];
var color = colors.splice(0, 1);
console.log(colors); // ["blue", "green", "orange", "black"]
console.log(color); // ["red"]

//如果只输入一个参数
var arr = [0, 1, 2, 3, 4];
var values = arr.splice(1);
console.log(arr); // [0]
console.log(values); // [1, 2, 3, 4]

插入：可以向指定位置插入任意数量的项，需要三个参数：起始位置，0（要删除的项数）和要插入的项。

var colors = ["red", "blue", "green"];
var colors2 = colors.splice(1, 0, "black");
console.log(colors); // ["red", "black", "blue", "green"]
console.log(colors2); // []

colors.splice(0, 0, [1, 2, 3]);
console.log(colors); // [Array(3), "red", "black", "blue", "green"]

替换：可以向指定位置插入任意数量的项，同时删除任意数量的项，需要三个参数：起始位置，要删除的项数和要插入的任意数量的项。

var colors = ["red", "blue", "green"];
var colors2 = colors.splice(0, 1, "black");
console.log(colors); // ["black", "blue", "green"]
console.log(colors2); // ["red"]

//如果删除项目大于数组长度
var colors = ["red", "blue", "green"];
var colors2 = colors.splice(0, 4, "black");
console.log(colors); // ["black"]
console.log(colors2); // ["red", "blue", "green"]

5、位置方法：indexOf()和lastIndexOf()

两个方法都接收两个参数：要查找的项和查找起点位置的索引（可选），其中indexOf()从数组开头向后查找，lastIndexOf()从数组末尾向前查找。
这两个方法都返回要查找元素在数组中的索引，在没有找到的情况下返回-1。

// indexOf()
var arr = [1, 1, 2, 1, 4];
console.log(arr.indexOf(2)); // 2
//如果有多个相同的元素，默认返回第一个
console.log(arr.indexOf(1)); // 0

//如果元素的类型不同
var arr = ["1", 1, 2, 1, 4];
console.log(arr.indexOf(1)); // 1
console.log(arr.indexOf("1")); // 0

// lastIndexOf()
var arr = [1, 1, 2, 1, 4];
console.log(arr.lastIndexOf(1)); // 3

// indexOf()
var colors = ["red", "blue", "green"];
console.log(colors.indexOf("red", 1)); // -1
console.log(colors.indexOf("red", 0)); // 0

// lastIndexOf()
var arr = [1, 2, 3, 3, 4, 5, 5, 2, 1];
console.log(arr.lastIndexOf(4, 1)); // -1,截止到索引为1的项前没有4
console.log(arr.lastIndexOf(4, 4)); // 4，截止到索引为4的项，索引为4的元素是4

6、迭代方法：every()、filter()、forEach()、map()和some()

每个方法都接收两个参数：要在每一项上运行的函数和运行该函数的作用域对象（影响this的值，可选的）。传入这些方法中的函数会接收三个参数：数组项的值，该项在数组中的位置和数组对象本身。

1)、every()和some()

// every()  
var numbers = [1, 2, 3, 4, 5];
var everyRes = numbers.every(function (item, index, array) {
  return item > 0;
})
console.log(everyRes); // true
var everyRes2 = numbers.every(function (item, index, array) {
  return item > 2;
})
console.log(everyRes2); // false
// 每一项都满足条件返回true，结果才是true，否则false

// some()
var numbers = [1, 2, 3, 4, 5];
var someRes = numbers.some(function (item, index, array) {
  return item > 0;
})
console.log(someRes); // true
var someRes2 = numbers.some(function (item, index, array) {
  return item > 2;
})
console.log(someRes2); // true
// 一项满足条件返回true，结果就是true

2)、filter()

var numbers = [1, 2, 3, 4, 5];
var filterRes = numbers.filter(function (item, index, array) {
  return item > 2;
})
console.log(filterRes); // [3, 4, 5]
console.log(numbers); // [1, 2, 3, 4, 5]
// 返回满足条件的元素组成的数组

3)、map()

var numbers = [1, 2, 3, 4, 5];
var mapRes = numbers.map(function (item, index, array) {
  return item * 10;
})
console.log(mapRes); // [10, 20, 30, 40, 50]
console.log(numbers); // [1, 2, 3, 4, 5]
// 返回结果组成的新数组

4)、forEach()

var numbers = [1, 2, 3, 4, 5];
var arr = [];
var forEachRes = numbers.forEach(function (item, index, array) {
  if (item > 3) {
    arr.push(item * 10)
  }
})
console.log(arr); // [40, 50]
console.log(numbers); // [1, 2, 3, 4, 5]

7、归并方法：reduce()和reduceRight()

这两个方法都会迭代数组的所有项，然后构建一个最终返回的值。接收；两个参数：一个在每一项上调用的函数和作为归并基础的初始值（可选的）。
reduce()方法从数组的第一项开始，逐个遍历到最后。
reduceRight()方法从数组的最后一项开始，向前遍历到第一项。
他们都接收4个参数，prev前一个值，cur当前值，index项的索引和array数组对象

// reduce()
var numbers = [1, 1, 1, 1, 1];
var res = numbers.reduce(function (prev, cur, index, array) {
return prev + cur
})
console.log(res); // 5
console.log(numbers); // [1, 1, 1, 1, 1]
//第一次执行回调函数，prev是1，cur是1，第二次prev是2（1+1返回结果），cur是1，以此类推...

var numbers = [1, 1, 1, 1, 1];
var a = 22;
var res = numbers.reduce(function (prev, cur, index, array) {
  return prev + cur
}, a)
console.log(res); // 27
console.log(numbers); // [1, 1, 1, 1, 1]

// reduceRight()
var numbers = [1, 2, 3, 4, 5];
var res = numbers.reduceRight(function (prev, cur, index, array) {
  return prev + cur
})
console.log(res); // 15
console.log(numbers); // [1, 2, 3, 4, 5]

var numbers = [1, 2, 3, 4, 5];
var a = 10;
var res = numbers.reduceRight(function (prev, cur, index, array) {
  return prev + cur
}, a)
console.log(res); // 25
console.log(numbers); // [1, 2, 3, 4, 5]

三、ES6

整理中

参考文档：

1、《JavaScript高级程序设计》（第三版）

2、《ES6 入门教程》（第三版）