JavaScript 数组方法

JavaScript具有许多有用的内置方法来处理数组。

修改原始数组的方法称为mutator(更改器)方法

返回新值或表示形式的方法称为accessor (访问器)方法

将数组转换为字符串

toString()数组方法将数组转换为(逗号分隔)数组值的字符串。

var months = ["Jan""Feb""Mar""Apr""May"];
document.getElementById("result").innerHTML = months.toString();

join()数组方法还可以将数组的所有元素转换为新的字符串。

此方法的行为类似于toString(),但是您还可以为join方法指定分隔符。

var fruits = ["Banana""Apple""Mango"];

fruits.join(" + ");   // Banana + Apple + Mango
fruits.join(" / ");   // Banana / Apple / Mango
fruits.join(" © ");  // Banana © Apple © Mango

当需要原始值时,JavaScript会自动将数组转换为逗号分隔的字符串。

当您试图输出一个数组时,总是会出现这种情况。

let fruits = ["Apple""Mango""Banana""Orange"];
document.getElementById("result").innerHTML = fruits;

push()方法 - 添加数组元素

push()数组方法将一个或多个新元素添加到数组的末尾。

var fruits = ["Banana""Mango""Apple"];
fruits.push("Strawberry");

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

以下代码将三个元素追加到数组。总变量包含数组的新长度:

var fruits = ["Banana""Mango""Apple"];
var total = fruits.push("Strawberry""Lychee""Guava");

unshift()数组方法将一个或多个新元素添加到数组的开头。

var fruits = ["Banana""Mango""Apple"];
fruits.unshift("Strawberry");

该unshift()方法的作用是:返回新的数组长度。

以下代码将三个元素添加到数组中。总变量包含数组的新长度:

var fruits = ["Banana""Mango""Apple"];
var total = fruits.unshift("Strawberry""Lychee""Guava");

pop()方法 - 删除数组元素

pop()方法的作用是:删除数组末尾的最后一个元素。

var fruits = ["Banana""Mango""Apple""Orange"];
fruits.pop();

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

var fruits = ["Banana""Mango""Apple""Orange"];
var x = fruits.pop();

shift()数组方法从数组中删除开始的第一个元素。

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

shift()方法返回被“移出(shifted out)”的元素:

var fruits = ["Banana""Mango""Apple""Orange"];
var x = fruits.shift();

splice()方法 - 添加修改数组

splice()方法通过删除现有元素和(或)添加新元素来更改数组。

var months = ['Jan''Mar''Apr''Jun'];
months.splice(10'Feb');// adding 'Feb' at index 1

第一个参数(1)定义了应添加(接合)新元素的位置。

第二个参数(0)定义应删除多少个元素。

第三个参数('Feb')定义要添加的新元素。

在以下示例中,我们将在第4个索引处替换1个元素:

var months = ['Jan''Feb''Mar''Apr''Jun'];
months.splice(41'May');   // replace 'Jun' with 'May' at index 4

在以下示例中,我们将从索引值为3中删除1个元素:

var months = ['Jan''Feb''Mar''Apr''Jun'];
months.splice(31);

在以下示例中,我们将从索引值2开始删除2个元素:

var months = ['Jan''Feb''Mar''Apr''Jun'];
months.splice(22);

splice()方法返回一个包含已删除元素的数组:

var months = ['Jan''Feb''Mar''Apr''Jun'];
var arr = months.splice(22);

注意splice()不要与slice()访问器数组混淆,后者是一个访问器数组,它将复制数组的一部分。

修改数组元素

通过使用赋值运算符分配新值,我们可以覆盖数组中的任何值。

let fruits = ["Apple""Mango""Banana""Orange"];
fruits[0] = "Monkey";

concat()方法 - 数组合并

concat()数组方法用来合并两个或更多个数组在一起以形成一个新的数组。

在下面的示例中,我们将创建两个数组并将它们组合为一个新数组:

var fruits = ["Apple""Mango""Banana"];
var numbers = [51012983];
var arr = fruits.concat(numbers);

concat()方法可以采用多个参数,您可以有效地使用单个方法将多个数组连接在一起。

var num1 = [1, 2, 3];
var num2 = [4, 5, 6];
var num3 = [7, 8, 9];

var nums = num1.concat(num2, num3);

slice()方法 - 数组切片

slice()数组方法将数组的一部分复制到新数组。

var fruits = ['Banana''Mango''Apple''Orange'];
var extract = fruits.slice(13);// return Mango, Apple

第一个参数(1)定义开始提取的位置。

第二个参数(3)定义结束提取的位置。

如果省略第二个参数,则该slice()方法将切出数组的其余部分。

在下面的示例中,我们将提取元素而不使用第二个参数:

var fruits = ['Banana''Mango''Apple''Orange'];
var extract = fruits.slice(1);// return Mango, Apple, Orange

在以下示例中,我们将使用负值提取数组元素:

var fruits = ['Banana''Mango''Apple''Orange'];
var extract = fruits.slice(-3, -1);// return Mango, Apple

在数组中查找元素

indexOf()数组方法返回可以在数组中找到给定元素的第一个索引。

var fruits = ['Banana''Mango''Apple''Orange'];
fruits.indexOf('Apple');// returns 2

注意:第一个元素的索引为0,第二个元素的索引为1,依此类推。

如果给定的参数是数组中不存在的值,那么它将返回-1

var fruits = ['Banana''Mango''Apple''Orange'];
fruits.indexOf('Beer');// returns -1

lastIndexOf()数组方法返回数组中可以找到给定元素的最后一个索引。

我们可以在indexOf()的同一示例上进行测试,该示例包含两个“ Apple”。

var fruits = ['Banana''Mango''Apple''Orange''Apple'];
fruits.lastIndexOf('Apple');// returns 4

注:lastIndexOf()将从末尾开始搜索数组,并返回它找到的第一个索引号。

如果给定的参数是数组中不存在的值,那么它将返回-1

var fruits = ['Banana''Mango''Apple''Orange''Apple'];
fruits.lastIndexOf('Beer');// returns -1

fill()方法

fill()数组方法用一个静态值替换数组中的所有元素。

var nums = [1, 2, 3, 4];
nums.fill(17);

数组中的所有四个元素均已替换为相同的值17。

fill()还接受起点和终点的可选参数。

从位置2到位置4填充0(不包括4):

var nums = [1, 2, 3, 4];
nums.fill(0, 2, 4);

使用fill()可以用静态值替换数组中的一个或多个元素。。

数组排序与数组反转

reverse()数组方法可反转数组中元素的顺序。

var nums = [10, 20, 30, 40, 50];
nums.reverse();

使用reverse()后,最后一个元素将是第一个,而第一个元素将是最后一个。

sort()数组方法根据元素中的第一个字符对数组中的元素进行排序。 在第一个字符相同的情况下,它将继续向下一行并比较第二个字符,依此类推。。

默认情况下,sort()将按字母顺序排列所有大写或小写字符串数组。

var months = ['March''Jan''Feb''Dec'];
months.sort();

由于sort()基于第一个unicode字符,因此它将对大写的元素进行排序,然后再对小写进行排序。

让我们修改原始数组,以使我们的字符串之一以小写字母开头。

var months = ['March''Jan''Feb''dec'];
months.sort();

可以使用sort()方法对数字进行排序。

var nums = [5, 1, 2, 7, 3, 6, 4];
nums.sort();

sort()不会按大小对数字数组排序。相反,它只检查数字中的第一个字符。

var nums = [5, 1, 2, 17, 13, 6, 34];
nums.sort();

为了正确地对数字进行排序,您可以创建一个比较函数作为参数。

var nums = [5, 1, 2, 17, 13, 6, 34];
nums.sort(function(a, b) {return a - b});

如果需要重复对数字进行排序,则可以创建一个单独的函数。

var nums = [5, 1, 2, 17, 13, 6, 34];
nums.sort(sortNumerically);

// Function to sort numbers by size
var sortNumerically = (a, b) => {
  return a - b;
}

 

评论
列表