数组方法精讲-优快云博客

本文链接：https://blog.youkuaiyun.com/m0_54386801/article/details/119154733

有关数组的方法

concat()方法

语法：array1.concat(array2,array3,...,arrayX)

concat() 方法用于连接两个或多个数组。

该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。

参数：arryX。必需。该参数可以是具体的值，也可以是数组对象。可以是任意多个。

返回值：Array对象.返回一个新的数组。该数组是通过把所有 arrayX 参数添加到 arrayObject 中生成的。如果要进行 concat() 操作的参数是数组，那么添加的是数组中的元素，而不是数组。

copyWithin() 方法

语法：array.copyWithin(target, start, end)

copyWithin() 方法用于从数组的指定位置拷贝元素到数组的另一个指定位置中。

参数：

target:必须。复制到指定目标索引位置

start：可选。元素复制的起始位置。

end：可选。停止复制的索引位置（默认为array.length）.如果为负数，表示倒数，即-1表示倒数第一个位置。

实例：复制数组的前面两个元素到第三和第四个位置上：

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

//Banana,Orange,Banana,Orange,Kiwi,Papaya

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

entries() 方法

语法：array.entries()

无参数

entries() 方法返回一个数组的迭代对象，该对象包含数组的键值对 (key/value)。

迭代对象中数组的索引值作为 key，数组元素作为 value。

无法直接获取数组迭代对象里的值。要通过next()方法或者for-of遍历,也可以用from()方法将数组迭代对象转化为数组。

var arr = [1,141,594,51,645,684,48,7,8,91,,6]
var arr1 = arr.entries();
//注意：这个迭代对象应该是会一直累加的，只要访问了其中一个元素，它就会往后走一步，也就是说用了Array.from()以后，迭代器就已经走完了，后面所有用到该迭代器的都会输出为{value:undefined,done:true},如果Array.from()在后面用，则会从迭代器走到的那个位置开始转化为数组，之前访问过的不会转化。（from()返回一个新数组，不会改变原来的）
//var arr2 = Array.from(arr1)
//console.log(arr2);//二维数组.[[0,1],[1,141],[2,594],...]
console.log(arr1);//Array Iterator{}
console.log(arr1[1]);//undefined
console.log(arr1.next());//第0项迭代对象，里面存了value(这里的value存的是数组的索引和对应索引数组的值)和done(false表示后面还有，true表示已经结束了，表示从这个元素开始（包括当前元素）后面都没有值了)（从第0项开始，每调用一次next()就往后一项）
console.log(arr1.next());//{value:[1,141],done:false}

for(var v of arr1){
    console.log(v);//这里会把数组迭代对象中的value给遍历出来
}

every()方法

语法：array.every(function(currentValue,index,arr), thisValue)

every() 方法用于检测数组所有元素是否都符合指定条件（通过函数提供）。

every() 方法使用指定函数检测数组中的所有元素：

如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。
如果所有元素都满足条件，则返回 true。

注意： every() 不会对空数组进行检测。

注意： every() 不会改变原始数组。

参数：function()。必须，函数，数组中的每个元素都会执行这个函数。

thisValue。可选，对象作为该执行回调时使用，传递给函数，用作 “this” 的值。
如果省略了 thisValue ，“this” 的值为 “undefined”

函数中的参数：currentValue：必须。当前元素的值

index：可选，当前元素的索引值。

arr：可选，当前元素属于的数组对象

实例：检测数组 ages 的所有元素是否都大于等于 18 :

var ages = [32, 33, 16, 40];

function checkAdult(age) {
    return age >= 18;
}
console.log(ages.every(checkAdult));
//false

fill()方法

语法：array.fill(value, start, end)

fill() 方法用于将一个固定值替换数组的元素。

参数：value:必填。填充的值

start:可选。开始填充的位置(默认为0)

end:可选。停止填充的位置（默认为array.length）

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.fill("Runoob", 2, 4);
//Banana,Orange,Runoob,Runoob

注意：会改变原数组。

filter() 方法

语法：array.filter(function(currentValue,index,arr), thisValue)

filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。

注意： filter() 不会对空数组进行检测。

注意： filter() 不会改变原始数组。

参数：

thisValue:可选。对象作为该执行回调时使用，传递给函数，用作 “this” 的值。
如果省略了 thisValue ，“this” 的值为 “undefined”

function()：必须。函数，数组中的每个元素都会执行这个函数

函数参数：currentValue:必须。当前元素的值.

index:可选。当前元素的索引值.

arr:可选。当前元素属于的数组对象.

例子：1.利用 filter 遍历出所有偶数:

let arr = [56, 15, 48, 3, 7];
let newArr = arr.filter(function (value, index, array) {
    return value % 2 === 0;
});
console.log(newArr)
// [56, 48]

2.利用 filter 进行数组去重：

function unique(arr) {
  return arr.filter(function(item, index, arr) {
    //当前元素，在原始数组中的第一个索引==当前索引值，否则返回当前元素
    return arr.indexOf(item, 0) === index;
  });
}
var arr = [1,1,'RUNOOB','RUNOOB',true,true,15];
console.log(unique(arr))
// [1, "RUNOOB", true, 15]

find()方法

语法：

array.find(function(currentValue, index, arr),thisValue)

find() 方法返回通过测试（函数内判断）的数组的第一个元素的值。

find() 方法为数组中的每个元素都调用一次函数执行：

当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素，之后的值不会再调用执行函数。
如果没有符合条件的元素返回 undefined

注意: find() 对于空数组，函数是不会执行的。

注意: find() 并没有改变数组的原始值。

参数：

thisValue:可选。对象作为该执行回调时使用，传递给函数，用作 “this” 的值。
如果省略了 thisValue ，“this” 的值为 “undefined”

function()：必须。函数，数组中的每个元素都会执行这个函数

函数参数：currentValue:必须。当前元素的值.

index:可选。当前元素的索引值.

arr:可选。当前元素属于的数组对象.

例子，获取数组中年龄大于18的第一个元素。

var ages = [3, 10, 18, 20];
 
function checkAdult(age) {
    return age >= 18;
}
var res = ages.find(checkAdult);
//res的值为20

findIndex() 方法

语法：

array.findIndex(function(currentValue, index, arr), thisValue)

findIndex() 方法返回传入一个测试条件（函数）符合条件的数组第一个元素位置。

findIndex() 方法为数组中的每个元素都调用一次函数执行：

当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置，之后的值不会再调用执行函数。
如果没有符合条件的元素返回 -1

注意: findIndex() 对于空数组，函数是不会执行的。

注意: findIndex() 并没有改变数组的原始值。

参数：

thisValue:可选。对象作为该执行回调时使用，传递给函数，用作 “this” 的值。
如果省略了 thisValue ，“this” 的值为 “undefined”

function()：必须。函数，数组中的每个元素都会执行这个函数

函数参数：currentValue:必须。当前元素的值.

index:可选。当前元素的索引值.

arr:可选。当前元素属于的数组对象.

例子，获取数组中年龄大于等于18的第一个元素索引的位置

var ages = [3, 10, 18, 20];
 
function checkAdult(age) {
    return age >= 18;
}
var res = ages.findIndex(checkAdult);
//res为2.

forEach()方法

语法：

array.forEach(function(currentValue, index, arr), thisValue)

forEach() 方法用于调用数组的每个元素，并将元素传递给回调函数。

注意: forEach() 对于空数组是不会执行回调函数的。

参数：

thisValue:可选。对象作为该执行回调时使用，传递给函数，用作 “this” 的值。
如果省略了 thisValue ，“this” 的值为 “undefined”

function()：必须。函数，数组中的每个元素都会执行这个函数

函数参数：currentValue:必须。当前元素的值.

index:可选。当前元素的索引值.

arr:可选。当前元素属于的数组对象.

例子，计算数组所有元素相加的总和

var sum = 0;
var numbers = [65, 44, 12, 4];
 
function myFunction(item) {
    sum += item;
}
numbers.forEach(myFunction);
//sum = 65+44+12+4 = 125

from()方法

语法：

Array.from(object, mapFunction, thisValue)

from() 方法用于通过拥有 length 属性的对象或可迭代的对象来返回一个数组。

如果对象是数组返回 true，否则返回 false。

参数：

object:必须，要转换为数组的对象。

mapFunction:可选，数组中每个元素要调用的函数。

thisValue:可选，映射函数(mapFunction)中的this对象。

例子，把字符串转化为数组

var myArr = Array.from("RUNOOB");
//myArr = ["R","U","N","O","O","B"]

使用箭头语法和映射函数更改元素的值。

var str = "1546151";
var arr = Array.from(str,x=>x*10);
console.log(arr);
//arr = [10,50,40,60,10,50,10]

includes()方法

语法：

arr.includes(searchElement)
arr.includes(searchElement, fromIndex)

includes() 方法用来判断一个数组是否包含一个指定的值，如果是返回 true，否则false。

参数：

searchElement：必须。需要查找的元素值。

fromIndex：可选。从该索引处开始查找 searchElement。如果为负值，则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。如果最后array.length + fromIndex还为负数，则整个数组都会被搜索。

indexOf()方法

语法：array.indexOf(item,start)

indexOf() 方法可返回数组中某个指定的元素位置。

参数：item:必须，查找的元素。start:可选的参数，规定在数组中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数，则将从字符串的首字符开始检索。

该方法将从头到尾地检索数组，看它是否含有对应的元素。开始检索的位置在数组 start 处或数组的开头（没有指定 start 参数时）。如果找到一个 item，则返回 item 的第一次出现的位置（在整个数组中的索引位置）。

如果在数组中没找到指定元素则返回 -1。

提示如果你想查找字符串最后出现的位置，可以使用lastIndesOf()方法。

isArray()方法

语法：Array.isArray(obj)

isArray() 方法用于判断一个对象是否为数组。

如果对象是数组返回 true，否则返回 false。

参数：obj：必须，要判断的对象

join()方法

join() 方法用于把数组中的所有元素转换成一个字符串。

元素是通过指定的分隔符进行分隔的。

语法：array.join(separator)

参数：separator：可选。指定要使用的分隔符。如果省略该参数，则使用逗号作为分隔符。

返回值：返回一个字符串。该字符串是通过把 arrayObject 的每个元素转换为字符串，然后把这些字符串连接起来，在两个元素之间插入 separator 字符串而生成的。

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

keys()方法

keys() 方法用于从数组创建一个包含数组键的可迭代对象。

如果对象是数组返回 true，否则返回 false。

语法：array.keys()

返回值，返回的是一个包含数组中每个索引键的Array Iterator对象。

注意:该方法不能直接输出索引键的值，需要用next()方法或者用for-of方法遍历，或用像Object.keys(arr)这样的方法，或用扩展运算符来将数组展开。

如下：

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var keys = fruits.keys();
console.log(keys);//一个数组迭代对象
console.log(fruits);//原数组
console.log(keys.next());//第0项迭代对象，里面存了value(这里的value存的是数组的索引)和done(false表示后面还有，true表示已经结束了，表示从这个元素开始（包括当前元素）后面都没有值了)（从第0项开始，每调用一次next()就往后一项）
for (const key of keys) {
  console.log(key);//0,1,2,3
  console.log(keys[key]);//undefined
}
var arr = ["a", , "c"];
var sparseKeys = Object.keys(arr);
var denseKeys = [...arr.keys()];
console.log(sparseKeys); // ['0', '2']
console.log(denseKeys);  // [0, 1, 2]

lastIndexOf()方法

lastIndexOf() 方法可返回一个指定的元素在数组中最后出现的位置，该方法是从后向前来查找的。

如果要检索的元素没有出现，则该方法返回 -1。

该方法将从尾到头地检索数组中指定元素 item。开始检索的位置在数组的 start 处或数组的结尾（没有指定 start 参数时）。如果找到一个 item，则返回 item 从尾向前检索第一次出现在数组的位置（在整个数组中的位置）。数组的索引开始位置是从 0 开始的。

如果在数组中没找到指定元素则返回 -1。

语法：array.lastIndexOf(item,start)

参数：item：必须。规定需检索的字符串值。

start：可选的整数参数。规定在数组中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数，则将从字符串的最后一个字符处开始检索。

map()方法

map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。

map() 方法按照原始数组元素顺序依次处理元素。

注意： map() 不会对空数组进行检测。

注意： map() 不会改变原始数组。

语法：

array.map(function(currentValue,index,arr), thisValue)

参数：function():必须。函数，数组中的每个元素都会执行这个函数。

thisValue:可选。对象作为该执行回调时使用，传递给函数，用作 “this” 的值。
如果省略了 thisValue，或者传入 null、undefined，那么回调函数的 this 为全局对象。

函数参数：currentValue:必须。当前元素的值

index：可选。当前元素的索引值

arr：可选。当前元素属于的数组对象。

var numbers = [4,9,16,25];var x = numbers.map(Math.sqrt);console.log(x);//[2,3,4,5]var y = numbers.map(function(v){    return v+1;})console.log(y);//[5,10,17,26]

pop()方法

pop() 方法用于删除数组的最后一个元素并返回删除的元素。

**注意：**此方法改变数组的长度！也就是改变了原数组。

提示： 移除数组第一个元素，请使用shift()方法。

语法：array.pop()

const sites = ['Google', 'Runoob', 'Taobao', 'Zhihu', 'Baidu'];
 
console.log(sites.pop());
// 输出结果为: "Baidu"
 
console.log(sites);
// 输出结果为: ['Google', 'Runoob', 'Taobao', 'Zhihu']
 
sites.pop();
 
console.log(sites);
//  输出结果为: ["Google", "Runoob", "Taobao"]

push()方法

push() 方法可向数组的末尾添加一个或多个元素，并返回新的长度。

注意： 新元素将添加在数组的末尾。

注意： 此方法改变数组的长度。也就是改变原数组。

提示： 在数组起始位置添加元素请使用 unshift() 方法。

语法：array.push(item1, item2, ..., itemX)

参数：itemX:必需。要添加到数组的元素。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi","Lemon","Pineapple")
console.log(fruits);//Banana,Orange,Apple,Mango,Kiwi,Lemon,Pineapple

reduce()方法

reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。

reduce() 可以作为一个高阶函数，用于函数的 compose。

注意: reduce() 对于空数组是不会执行回调函数的。

语法：

array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

参数：function():必需。用于执行每个数组元素的函数。

initialValue：可选。传递给函数的初始值。

函数参数：total:必需。初始值，或者计算结束之后的返回值。

currentValue:必需。当前元素。

currentIndex:可选。当前元素的索引

arr:可选。当前元素所属的数组对象。

计算数组元素相加后的总和

var nums = [51,49,20,50,30]
var sum = nums.reduce(function(total,num){
    return total+num;
})
console.log(sum);//200

reduceRight() 方法

reduceRight() 方法的功能和 reduce() 功能是一样的，不同的是 reduceRight() 从数组的末尾向前将数组中的数组项做累加。

注意: reduce() 对于空数组是不会执行回调函数的。

语法：

array.reduceRight(function(total, currentValue, currentIndex, arr), initialValue)

参数：function():必需。用于执行每个数组元素的函数。

initialValue：可选。传递给函数的初始值。

函数参数：total:必需。初始值，或者计算结束之后的返回值。

currentValue:必需。当前元素。

currentIndex:可选。当前元素的索引

arr:可选。当前元素所属的数组对象。

reverse()方法

reverse() 方法用于颠倒数组中元素的顺序。

语法：array.reverse()

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

shift()方法

shift() 方法用于把数组的第一个元素从其中删除，并返回第一个元素（就是那个被删掉的）的值。

注意： 此方法改变数组的长度！也就是改变原数组

提示: 移除数组末尾的元素可以使用 pop() 方法。

语法：array.shift()

slice()方法

slice() 方法可从已有的数组中返回选定的元素。

slice()方法可提取字符串的某个部分，并以新的字符串返回被提取的部分。

注意： slice() 方法不会改变原始数组。

语法：array.slice(start,end)

参数：

start:可选。规定从何处开始选取（选取的部分包括start自己本身）。如果是负数，那么它规定从数组尾部开始算起的位置。如果该参数为负数，则表示从原数组中的倒数第几个元素开始提取，slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素（包含最后一个元素）。

end:可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果有该参数，选取的数组片段不包括end。如果没有指定该参数，那么切分的数组包含从 start 到数组结束的所有元素。如果该参数为负数，则它表示在原数组中的倒数第几个元素结束抽取。 slice(-2,-1) 表示抽取了原数组中的倒数第二个元素到最后一个元素（不包含最后一个元素，也就是只有倒数第二个元素）。

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var myBest = fruits.slice(-3,-1); // 截取倒数第三个（包含）到倒数第一个（不包含）的两个元素
var myBest = fruits.slice(-3);  // 截取最后三个元素

some()方法

some() 方法用于检测数组中的元素是否满足指定条件（函数提供）。

some() 方法会依次执行数组的每个元素：

如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。
如果没有满足条件的元素，则返回false。

注意： some() 不会对空数组进行检测。

注意： some() 不会改变原始数组。

语法：

array.some(function(currentValue,index,arr),thisValue)

参数：

function():必需。用于执行每个数组元素的函数。

thisValue：可选。对象作为该执行回调时使用，传递给函数，用作 “this” 的值。
如果省略了 thisValue ，“this” 的值为 “undefined”

函数参数：

currentValue:必需。当前元素。

index:可选。当前元素的索引

arr:可选。当前元素所属的数组对象。

sort()方法

sort() 方法用于对数组的元素进行排序。

排序顺序可以是字母或数字，并按升序或降序。

默认排序顺序为按字母升序。

**注意：**当数字是按字母顺序排列时"40"将排在"5"前面。

使用数字排序，你必须通过一个函数作为参数来调用。

函数指定数字是按照升序还是降序排列。

注意： 这种方法会改变原始数组！。

语法：array.sort(sortfunction)

参数：sortfunction:可选。规定排序顺序。必须是函数

返回的是一个数组，注意：数组在原数组上进行排序，不生成副本。

var points = [40,100,1,5,25,10];
points.sort(function(a,b){return b-a});
//points输出的结果是：100,40,25,10,5,1
//这里排序的逻辑是：a是前面的一个数，b是后面的一个数。如果b大于a，那么b-a就为正数，返回true，sort就会将a和b的位置换一下，如果b比a小，那么返回的就是false，sort就不会执行，也就是说后面的数如果比前面的数大，就跟前面的位置换一下，比前面的数小就不动。
//所以这里的排序是从大到小的排序

splice()方法

splice() 方法用于添加或删除数组中的元素。

**注意：**这种方法会改变原始数组。

语法：

array.splice(index,howmany,item1,.....,itemX)

参数：

index:必需。规定从何处添加/删除元素。

howmany：可选。规定应该删除多少元素。必须是数字，但可以是 “0”。
如果未规定此参数，则删除从 index 开始到原数组结尾的所有元素。

itemX:可选。要添加到数组的新元素。

返回值：返回的是被删除的元素组成的数组，如果没有被删除的元素，则返回的数组为空。

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

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

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

toString()方法

toString() 方法可把数组转换为字符串，并返回结果。

注意： 数组中的元素之间用逗号分隔。原数组不会改变

语法：array.toString()

var fruits = ["Banana", "Orange", "Apple", "Mango"];
console.log(fruits.toString())//字符串：Banana,Orange,Apple,Mango
console.log(fruits)//数组：["Banana", "Orange", "Apple", "Mango"]

unshift()方法

unshift() 方法可向数组的开头添加一个或更多元素，并返回新的长度。

注意： 该方法将改变数组的数目。也就是改变原数组

提示: 将新项添加到数组末尾，使用 push()方法。

语法:array.unshift(item1,item2, ..., itemX)

参数：itemX：可选。向数组起始位置添加一个或多个元素

返回值为数组的新长度。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon","Pineapple");
console.log(fruits);
//["Lemon","Pineapple","Banana", "Orange", "Apple", "Mango"]