JavaScript 中对 Array 数组操作

Question

在编写 JavaScript 脚本代码的时候，经常会使用到数组，比如使用 JSON 返回 JSON 字符串，转换为数组，然后遍历输出，我们大多数是创建了数组，然后就使用他，但是很少去修改数组，比如增加元素、排序、插入元素、删除元素等操作，今天就给大家分享一下 JavaScript 中对数组的操作的方法。

创建数组

创建一个数组有两个方法，不过推荐大家使用第二种方法，显得正式一些。

1、定义并赋值

var str = ['java', 'php', 'c++'', 'vb'];

用 [] 定义后赋值

var array = []; //定义一个空数组
array[0] = "Tom";
array[1] = "Male";
array[2] = "123456@qq.com";

数组的下标

array['name'] = "Tom";
array['sex'] = "Male";
array['mail'] = "123456@qq.com";

使用 new Array() 定义

var arr = new Array(10);

定义一个长度为 10 的数组，此时为 arr 已经开辟了内存空间，用数组名称加  [下标]  来调用。

var a = new Array();
a[0] = 10;
a[1] = "Tom";
a[2] = 12.6;

定义一个可变数组，并进行赋值。

var a = new Array(1, 2, 3, 4, 5);
var b = [1, 2, 3, 4, 5];

a 和 b 都是数组，只不过 b 用了隐性声明，创建了另一个实例，此时如果用 alert(a==b) 将弹出 false。

数组就是某类数据的集合，数据类型可以是整型、字符串、甚至是对象。

JavaScript 不支持多维数组，但是因为数组里面可以包含对象（数组也是一个对象），所以数组可以通过相互嵌套实现类似多维数组的功能。

数组里面可以包含对象，所以可以把数组里面的某个元素再声明为数组，例如

var a = new Array();
a[0] = new Array();
a[0][0] = 1;
console.log(a[0][0]); //弹出 1

声明的时候赋值

var a = new Array([1,2,3], [4,5,6], [7,8,9]);
var b = [[1,2,3], [4,5,6], [7,8,9]];

插入元素

1、在数组末尾插入元素

要在数组的末尾插入一个或多个元素可以使用 push() 方法，这个方法会返回新的数组的长度。

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
//添加元素
arr.push("James")

在指定索引位置插入元素

将一项插入到一个现有数组的特定索引。听起来很容易但是他却花费了我很多事件。

// The original array
var array = ["one", "two", "four"];
// splice(position, numberOfItemsToRemove, item)
array.splice(2, 0, "three");
console.log(array);  // ["one", "two", "three", "four"]

你也可以定义一个匿名函数：

Array.prototype.insert = function (index, item) {
  this.splice(index, 0, item);
};

移除元素

splice 函数可以从数组中添加或者删除元素，然后返回被删除的项目。

注意：该方法会改变原始数组。

// Start with an initial array
var array = ["a", "b", "c"];

// Find and remove item from an array
var i = array.indexOf("b");
if(i != -1) {
    array.splice(i, 1);
}

当然如果你想要移除的每个数的字符串相同的多个匹配项，您将需要添加更多一点的逻辑：

for(var i = array.length-1; i--;){
    if (array[i] === "b") array.splice(i, 1);
}

你可能会想 filter 方法将工作：

array.filter(function(i) {
    return i != "b"
});

从数组中删除给定的值并不是太困难的任务，它将返回一个新的数组。

复制数组

项目中，可能需要复制一个数组，以保留这个数组的值，克隆一个数组可以是 slice 一样容易，请看下面的代码：

var clone = myArray.slice(0);

上面的代码创建原始数组，克隆请记住如果你的数组中存在的对象，保留引用，即上面的代码并不克隆的数组内容。将作为本机方法添加到阵列的 clone，你会做这样的事情：

Array.prototype.clone = function() {
    return this.slice(0);
};

清空数组

清空数组的任务同样重要，但我也经常看到的不正确的方式执行的任务。很多时候开发人员将创建一个新的数组：

1、错误的方法

myArray = []; // bad

这并不是最佳的方式来获得一个新的数组，要截断数组中，并使其为空，应将 length 属性设置为零：

2、正确的方法

myArray.length = 0; // good!

设置长度等于零清空现有的阵列，不创建另一个数组，这可以帮助您避免指针与数组以及问题。与上述新的数组方法：

// ... as provided by Dag in the comments
A = [1,2,3,4,5]
B = A
A = []
console.log(B) // [1,2,3,4,5]

length 截断将使 A 和 B 的原始数组只是空口 ！

数组排序

尽管 JavaScript 数组排序有很多的插件或者工具可以实现，但是那些工具都显得很臃肿了

大多数人会认为这种采取没有一种方法，只需排序的数组中的基本项目：

[1, 3, 9, 2].sort();
// Returns: [1, 2, 3, 9]
    
[1, "a", function(){}, {}, 12, "c"].sort();
// Returns: [1, 12, Object, "a", "c", function (){}]

但不仅如此，如果你提供一个函数表达式到的排序方法，你可以使用简单的逻辑阵列内的对象进行排序。假设您有一个数组，这些对象表示的人，你想要对它们进行排序按年龄。是的它能做到了，很容易地：

[
    { name: "Robin Van Persie", age: 28 },
    { name: "Theo Walcott", age: 22 },
    { name: "Bacary Sagna", age: 26  }
].sort(function(obj1, obj2) {
// Ascending: first age less than the previous
return obj1.age - obj2.age;
});
// Returns:  
// [
//      { name: "Theo Walcott", age: 22 },
//      { name: "Bacary Sagna", age: 26  },
//      { name: "Robin Van Persie", age: 28 }
// ]

匿名函数返回第一个对象年龄小于是否比第二个的因而排序按年龄升序整个数组。反向要按降序排序的第一和第二个参数。