JavaScript数组【下篇】

从数组中删除元素

要从数组中删除最后一个元素，您可以使用该pop()方法。此方法返回弹出的值。这是一个例子：

例子

var colors = ["Red", "Green", "Blue"];
var last = colors.pop();
 
document.write(last); // Prints: Blue
document.write(colors.length); // Prints: 2

shift()同样，您可以使用该方法从数组中删除第一个元素。此方法还返回移出的值。这是一个例子：

例子

var colors = ["Red", "Green", "Blue"];
var first = colors.shift();
 
document.write(first); // Prints: Red
document.write(colors.length); // Prints: 2

提示： push()和pop()运行得更快。因为push()和pop()方法只是在数组末尾添加和删除元素，因此元素不会移动，而unshift()``shift()在数组开头添加和删除元素需要重新索引整个数组。

在任何位置添加或删除元素

该splice()方法是一种非常通用的数组方法，允许您使用语法在任何索引中添加或删除元素arr.splice(startIndex, deleteCount, elem1, ..., elemN)。

该方法需要三个参数：第一个参数是开始拼接数组的索引，它是必需的；第二个参数是要移除的元素数量（0如果您不想移除任何元素，请使用），它是可选的；第三个参数是一组替换元素，也是可选的。下面的例子展示了它是如何工作的：

例子

var colors = ["Red", "Green", "Blue"];
var removed = colors.splice(0,1); // Remove the first element
 
document.write(colors); // Prints: Green,Blue
document.write(removed); // Prints: Red (one item array)
document.write(removed.length); // Prints: 1
 
removed = colors.splice(1, 0, "Pink", "Yellow"); // Insert two items at position one
document.write(colors); // Prints: Green,Pink,Yellow,Blue
document.write(removed); // Empty array
document.write(removed.length); // Prints: 0
 
removed = colors.splice(1, 1, "Purple", "Voilet"); // Insert two values, remove one
document.write(colors); //Prints: Green,Purple,Voilet,Yellow,Blue
document.write(removed); // Prints: Pink (one item array)
document.write(removed.length); // Prints: 1

该splice()方法返回一个已删除元素的数组，如果没有删除任何元素，则返回一个空数组，如上例所示。如果省略第二个参数，则从数组的开头到结尾的所有元素都将被删除。与slice()和concat()方法不同，该splice()方法修改了调用它的数组。

从数组创建字符串

在某些情况下，您只想通过连接数组的元素来创建字符串。为此，您可以使用该join()方法。此方法采用可选参数，该参数是添加在每个元素之间的分隔符字符串。如果省略分隔符，JavaScript 将,默认使用逗号 ( )。下面的例子展示了它是如何工作的：

例子

var colors = ["Red", "Green", "Blue"];
 
document.write(colors.join()); // Prints: Red,Green,Blue
document.write(colors.join("")); // Prints: RedGreenBlue
document.write(colors.join("-")); // Prints: Red-Green-Blue
document.write(colors.join(", ")); // Prints: Red, Green, Blue

您还可以使用toString(). 此方法不接受分隔符参数，如join(). 这是一个例子：

例子

var colors = ["Red", "Green", "Blue"];
document.write(colors.toString()); // Prints: Red,Green,Blue

提取数组的一部分

如果您想提取数组的一部分（即子数组）但保持原始数组完整，您可以使用该slice()方法。此方法采用 2 个参数：开始索引（开始提取的索引）和可选的结束索引（结束提取的索引），例如arr.slice(startIndex, endIndex). 这是一个例子：

例子

var fruits = ["Apple", "Banana", "Mango", "Orange", "Papaya"];
var subarr = fruits.slice(1, 3);
document.write(subarr); // Prints: Banana,Mango

如果endIndex省略参数，则提取数组末尾的所有元素。您还可以指定负索引或偏移量——在这种情况下，该slice()方法从数组的末尾而不是开头提取元素。例如：

例子

var fruits = ["Apple", "Banana", "Mango", "Orange", "Papaya"];
 
document.write(fruits.slice(2)); // Prints: Mango,Orange,Papaya
document.write(fruits.slice(-2)); // Prints: Orange,Papaya
document.write(fruits.slice(2, -1)); // Prints: Mango,Orange

合并两个或多个数组

该concat()方法可用于合并或组合两个或多个数组。此方法不会更改现有数组，而是返回一个新数组。例如：

例子

var pets = ["Cat", "Dog", "Parrot"];
var wilds = ["Tiger", "Wolf", "Zebra"];
 
// Creating new array by combining pets and wilds arrays
var animals = pets.concat(wilds); 
document.write(animals); // Prints: Cat,Dog,Parrot,Tiger,Wolf,Zebra

该concat()方法可以采用任意数量的数组参数，因此您可以从任意数量的其他数组创建一个数组，如下例所示：

例子

var pets = ["Cat", "Dog", "Parrot"];
var wilds = ["Tiger", "Wolf", "Zebra"];
var bugs = ["Ant", "Bee"];
 
// Creating new array by combining pets, wilds and bugs arrays
var animals = pets.concat(wilds, bugs); 
document.write(animals); // Prints: Cat,Dog,Parrot,Tiger,Wolf,Zebra,Ant,Bee

搜索数组

如果要在数组中搜索特定值，只需使用indexOf()and即可lastIndexOf()。如果找到该值，则两种方法都返回表示数组元素的索引。如果未找到该值，-1则返回。该indexOf()方法返回找到的第一个，而lastIndexOf()返回找到的最后一个。

例子

var fruits = ["Apple", "Banana", "Mango", "Orange", "Papaya"];
 
document.write(fruits.indexOf("Apple")); // Prints: 0
document.write(fruits.indexOf("Banana")); // Prints: 1
document.write(fruits.indexOf("Pineapple")); // Prints: -1

这两种方法还接受来自 index的可选整数参数，该参数指定数组中开始搜索的索引。这是一个例子：

例子

var arr = [1, 0, 3, 1, false, 5, 1, 4, 7];
 
// Searching forwards, starting at from- index
document.write(arr.indexOf(1, 2)); // Prints: 3
 
// Searching backwards, starting at from index
document.write(arr.lastIndexOf(1, 2)); // Prints: 0

您还可以使用includes()方法来找出数组是否包含某个元素。indexOf()此方法采用与和方法相同的参数lastIndexOf()，但它返回true或false而不是索引号。例如：

例子

var arr = [1, 0, 3, 1, false, 5, 1, 4, 7];
 
document.write(arr.includes(1)); // Prints: true
document.write(arr.includes(6)); // Prints: false
document.write(arr.includes(1, 2)); // Prints: true
document.write(arr.includes(3, 4)); // Prints: false

如果要根据特定条件搜索数组，可以使用find()ES6 中新引入的 JavaScript 方法。此方法返回数组中满足提供的测试函数的第一个元素的值。否则返回undefined。

例子

var arr = [1, 0, 3, 1, false, 5, 1, 4, 7];
 
var result = arr.find(function(element) {
  return element > 4;
});
document.write(result); // Prints: 5

还有一种类似于find()的findIndex()方法的方法，它返回数组中找到的元素的索引而不是它的值。例如：

例子

var arr = [1, 0, 3, 1, false, 5, 1, 4, 7];
 
var result = arr.findIndex(function(element) {
  return element > 6;
});
document.write(result); // Prints: 8

该find()方法仅查找满足提供的测试功能的第一个元素。但是，如果您想找出所有匹配的元素，您可以使用该filter()方法。

该filter()方法创建一个包含所有成功通过给定测试的元素的新数组。以下示例将向您展示其实际工作原理：

例子

var arr = [1, 0, 3, 1, false, 5, 1, 4, 7];
 
var result = arr.filter(function(element) {
  return element > 4;
});
document.write(result); // Prints: 5,7
document.write(result.length); // Prints: 2