JavaScript数组方法

JavaScript数组的强大在于数组提供了内建的方法和属性.

将数组转换为字符串

toString() 将数组转换为（逗号分隔）数组值的字符串.

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString();

让我试试

join() 方法还将所有数组元素连接为字符串.

它的行为就像toString()，但是可以指定分隔符:

var fruits = ["Banana", "Orange","Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.join(" * ");

让我试试

弹出和推入

使用数组时，很容易移除和添加新元素.

这里解释什么是push和pop:

Pop是从数组中弹出项目, push是向数组中添加项目.

Popping

pop() 方法移除数组中的最后一个元素:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop();              // Removes the last element ("Mango") from fruits

让我试试

pop() 方法返回“弹出”的值:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.pop();      // the value of x is "Mango"

让我试试

Pushing

push() 方法向数组（末尾）添加新元素:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi");       //  Adds a new element ("Kiwi") to fruits

让我试试

push() 方法返回新数组长度:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = fruits.push("Kiwi");   //  the value of x is 5

让我试试

Shifting 删除元素

Shifting等价于popping,使用第一个元素而不是最后一个元素.

shift() 方法移除第一个数组元素并将所有其他元素“移”到较低的索引.

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift();            // Removes the first element "Banana" from fruits

让我试试

shift() 方法返回“移出”字符串:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift();             // Returns "Banana"

让我试试

unshift() 方法添加新的元素到数组（开头），和“unshifts“旧元素:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");    // Adds a new element "Lemon" to fruits

让我试试

unshift() 方法返回新数组长度。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");    // Returns 5

让我试试

修改元素

数组元素使用其索引号访问:

数组索引以0开头。[ 0 ]是第一个数组元素，[ 1 ]是第二个，[ 2 ]是第三 ...

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[0] = "Kiwi";        // Changes the first element of fruits to "Kiwi"

让我试试

长度属性提供了一个简单的方法来向数组中添加新元素:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Kiwi";          // Appends "Kiwi" to fruit

让我试试

删除元素

由于JavaScript数组是对象，元素可以被删除通过使用JavaScript的delete操作符:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
delete fruits[0];           // Changes the first element in fruits to undefined

让我试试

使用删除会在数组中留下未定义的孔。使用pop()或shift()代替.

拼接的数组

splice() 方法可用于向数组中添加新项:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");

让我试试

第一个参数（2）定义应增加新的元素的位置（拼接）.

第二个参数（0）定义了应该移除多少个元素.

其余的参数（"Lemon" , "Kiwi"）定义要添加的新元素

使用splice()删除元素

用巧妙的参数设置，你可以使用splice()删除元素而不会留下的“空洞”的数组:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(0, 1);        // Removes the first element of fruits

让我试试

第一个参数（2）定义应增加新的元素的位置（拼接）.

第二个参数（0）定义了应该移除多少个元素.

其余参数省略。没有新的元素将被添加.

连接数组

concat() 方法通过连接两个数组，创建一个新数组:

var myGirls = ["Cecilie", "Lone"];
var myBoys = ["Emil", "Tobias","Linus"];
var myChildren = myGirls.concat(myBoys);     // Concatenates (joins) myGirls and myBoys

让我试试

concat() 方法可以取任意数量的数组参数:

var arr1 = ["Cecilie", "Lone"];
var arr2 = ["Emil", "Tobias","Linus"];
var arr3 = ["Robin", "Morgan"];
var myChildren = arr1.concat(arr2, arr3);     // Concatenates arr1 with arr2 and arr3

让我试试

切片数组

slice() 方法将数组中的一个数组分割成新数组.

此示例从数组元素1中分割出数组的一部分("Orange"):

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1);

让我试试

slice() 方法创建新数组。它不会移除源数组中的任何元素.

此示例从数组元素3中分割出数组的一部分 ("Apple"):

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(3);

让我试试

slice() 方法可以使用两个参数 slice(1, 3).

然后，该方法从起始参数中选择元素，直至（但不包括）结束参数。

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1, 3);

让我试试

如果结尾参数被省略，像第一个例子的方法，slice()切片出其余的数组。

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(2);

让我试试

自动 toString()

当期望一个原始值时，JavaScript会自动将数组转换成字符串.这两个例子会产生相同的结果:

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString();

让我试试

var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits;

让我试试

所有JavaScript对象有一个tostring()方法。

排序数组

排序数组在本教程的下一章讲述.

完整的数组参考

完整的数组参考, 访问我们的完整的数组参考.

参考包含所有数组属性和方法的说明和示例.