数组的方法总结

ES6之前的数组方法总结

[ 1.concat() ]

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

语法: concat()
返回值:返回一个新的数组

代码示例(如下)

 const arr1 = ['a', 'b', 'c'];
      const arr2 =  ['d', 'e', 'f'];
      const arr3 = ['g', 'h', 'i'];

      const array = arr1.concat(arr2, arr3);
      // ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i']

[ 2.every()]

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

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

  • 如果所有元素都满足条件,则返回 true

语法: Array.every(function(currentValue,index,array), thisValue)

callbackFn: 必需,数组中每个元素需要调用的函数。
currentValue:必选,当前元素。
index:可选,当前元素的索引
arr:可选,当前元素所属的数组对象
thisValue:可选,传递给函数的值一般用 "this" 值。如果这个参数为空, "undefined" 会传递给 "this" 值

返回值:布尔值。如果所有元素都通过检测返回 true,否则返回 false。

代码示例(如下)

var ages = [56, 13, 6, 36];

function checkAdult(age) {
    return age >= 18;
}

function myFunction() {
    document.getElementById("demo").innerHTML = ages.every(checkAdult);
} //输出 false

[3.filter()]

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

语法: Array.filter(function(currentValue, indedx, array), thisValue)

callbackFn: 必需,数组中每个元素需要调用的函数。
currentValue:必选,当前元素。
index:可选,当前元素的索引
arr:可选,当前元素所属的数组对象
thisValue:可选,传递给函数的值一般用 "this" 值。如果这个参数为空, "undefined" 会传递给 "this" 值

返回值: 返回数组,包含了符合条件的所有元素。如果没有符合条件的元素则返回空数组。

代码示例(如下)

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

function checkAdult(age) {
    return age >= 18;
}

function myFunction() {
    document.getElementById("demo").innerHTML = ages.filter(checkAdult);
}  // 32,33,40

[ 4.forEach() ]

forEach(): 方法用于调用数组的每个元素,并将元素传递给回调函数。并且 forEach() 对于空数组是不会执行回调函数的。

语法: array.forEach(callbackFn(currentValue, index, arr), thisValue)

callbackFn: 必需,数组中每个元素需要调用的函数。
currentValue:必选,当前元素。
index:可选,当前元素的索引
arr:可选,当前元素所属的数组对象
thisValue:可选,传递给函数的值一般用 "this" 值。如果这个参数为空, "undefined" 会传递给 "this" 值

返回值:undefined。

代码示例(如下)

let arr = ['anzuo', 'ios', 'fei']
let arr2 = arr.forEach(function (ele, index) {
console.log(ele); 
 // 输出  anzuo ios fei
console.log(index); 
// 下标
})

[ 5.indexOf() ]

indexOf(): 方法可返回数组中某个指定的元素位置。如果找到一个 item,则返回 item 的第一次出现的位置。开始位置的索引为 0。如果在数组中没找到指定元素则返回 -1。

语法: array.indexOf( item, start)
item: 必须。要查找的元素。
fromIndex(可选):可选的整数参数。规定在数组中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1,如果是负数就是倒数到位置开始
返回值:元素在数组中的位置,如果没有搜索到则返回 -1。

代码示例(如下)

let array = [6,9,5,6];
let arr =array.indexOf(6); 
console.log(arr)// 0

[ 6.isArray() ]

join():

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

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

语法:
Array.isArray(obj)
obj: 必需,要判断的对象。
返回值:布尔值,如果对象是数组返回 true,否则返回 false。

代码示例(如下)

function myFunction() {
    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    var x = document.getElementById("demo");
    x.innerHTML = Array.isArray(fruits);
}

[ 7.join() ]

join(): 方法用于把数组中的所有元素转换一个字符串。元素是通过指定的分隔符进行分隔的。

语法: join(separator)
separator: 可选。指定要使用的分隔符。如果省略该参数,则使用逗号作为分隔符。
返回值:返回一个字符串。该字符串是通过把 arrayObject 的每个元素转换为字符串,然后把这些字符串连接起来,在两个元素之间插入 separator 字符串而生成的。

代码示例(如下)

const arr = ["zj", "wzf", "sss"];
let array =  arr.join(" and "); 
console.log(array)
//zj and wzf and sss

[ 8.lastIndexOf() ]

lastIndexOf(): 方法可返回一个指定的元素在数组中最后出现的位置,从该字符串的后面向前查找。如果要检索的元素没有出现,则该方法返回 -1。

语法: array.lastIndexOf( item, start)
item: 必需。规定需检索的字符串值。
fromIndex(可选):可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的最后一个字符处开始检索。
返回值:如果在 stringObject 中的 fromindex 位置之前存在 searchvalue,则返回的是出现的最后一个 searchvalue 的位置。

代码示例(如下)

let array = [6,9,5,6];
let arr =array.lastIndexOf(6); 
console.log(arr);  // 3

[ 9.map() ]

map(): 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。并按照原始数组元素顺序依次处理元素。不会改变原始数组,也不会对空数组进行检测。

语法: array.map(function(currentValue, index, array), thisIndex)

callbackFn: 必需,数组中每个元素需要调用的函数。
currentValue:必选,当前元素。
index:可选,当前元素的索引
arr:可选,当前元素所属的数组对象
thisValue:可选,传递给函数的值一般用 "this" 值。如果这个参数为空, "undefined" 会传递给 "this" 值

返回值:返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值

代码示例(如下)

let numbers = [4, 9, 16, 25];

function myFunction() {
    x = document.getElementById("demo")
    x.innerHTML = numbers.map(Math.sqrt);
}//结果2,3,4,5

[10. pop() ]

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

注意:此方法改变数组的长度!

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

语法: pop()
返回值:从数组中删除的元素(当数组为空时返回 undefined)。

代码示例(如下)

let a = ["zj", "wzf", "sss"];

let b = a.pop();

console.log(b);
 // "sss"

[ 11.push() ]

push(): 方法将一个或多个元素添加到数组的末尾,并返回该数组的新长度

语法: push([item1[item2[...[itemN]]]])
说明:item1,item2,. . . ,itemN:可选项,该Array的新元素。
返回值:数组新长度

代码示例(如下)

let arr1 = ["sb", "jsn"];
let arr2 = arr1.push("yes", "zzh");
console.log(arr2);
// 4

[ 12.reduce()]

reduce(): 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。还可以作为一个高阶函数,用于函数的 compose。

语法: Array.reduce(function(total, currentValue, currentIndex, arr), initialValue);

total: 必需。 初始值, 或者计算结束后的返回值。
currentValue: 必需, 当前元素。
currentIndex: 可选,当前元素的索引。
arr:可选, 当前元素的索引
initialValue: 可选,当前元素所属的数组对象。

返回值:返回计算结果

代码示例(如下)

let arr = [1, 2, 3, 4, 5];
let sum = arr.reduce((sum, curr) => sum + curr, 0);
console.log(sum);//15

[ 13.reduceRight() ]

reduceRight():reduceRight() 方法的功能和reduce()功能是一样的,不同的是 reduceRight() 从数组的末尾向前将数组中的数组项做累加。但是reduce()对于空函数是不回调的。

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

total: 必需。 初始值, 或者计算结束后的返回值。
currentValue: 必需, 当前元素。
currentIndex: 可选,当前元素的索引。
arr:可选, 当前元素的索引
initialValue: 可选,当前元素所属的数组对象。

返回值:返回计算结果

代码示例(如下)

let arr = [5, 4, 3, 2, 1];
let sum = arr.reduce((sum, curr) => sum + curr, 0);
console.log(sum);//15

[ 14.reverse() ]

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

语法: reverse()
返回值:颠倒顺序后的数组。

代码示例(如下)

const a = ['a', 'b', 'c'];

console.log(a); // ['a', 'b', 'c']

let b = a.reverse();

console.log(b); // [ 'c','a', 'b']

[ 15.shift() ]

shift(): 方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。

注意: 此方法改变数组的长度!

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

语法: shift()
返回值:数组原来的第一个元素的值(移除的元素)。

代码示例(如下)

let arr = new.Array(5,60,50,40,7);
arr.shift(); //[60,50,40,7]

[ 16. unshiift() ]

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

注意: 该方法将改变数组的数目。

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

语法: unshift()
返回值:返回调用方法对象的新 length 属性值。

代码示例(如下)

arr = [8, 4, 9];

arr.unshift(6);

console.log(arr);
// [6, 8, 4, 9]

[ 17.slice() ]

slice(): 方法可从已有的数组中返回选定的元素。方法还可提取字符串的某个部分,并以新的字符串返回被提取的部分。

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

语法: slice(start, end)
start(可选):规定从何处开始选取。如果该参数为负数,则表示从原数组中的倒数第几个元素开始提取。
end(可选):规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果该参数为负数, 则它表示在原数组中的倒数第几个元素结束抽取。

代码示例(如下)

let a = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
let b = a.slice(1, 3);
console.log(b);//["Orange", "Lemon"]

[ 18.some()]

some(): 方法用于检测数组中的元素是否满足指定条件(函数提供),some() 方法会依次执行数组的每个元素,如果用一个空数组进行测试,在任何情况下它返回的都是false。

语法: Array.every(function(currentValue,index,array), thisValue)

currentValue:必选,当前元素。
index:可选,当前元素的索引
arr:可选,当前元素所属的数组对象
thisValue:可选,传递给函数的值一般用 "this" 值。如果这个参数为空, "undefined" 会传递给 "this" 值

返回值:布尔值。如果数组中有元素满足条件返回 true,否则返回 false。

代码示例(如下)

var ages = [10, 5, 6, 20];

function checkAdult(age) {
    return age >= 18;
}

function myFunction() {
    document.getElementById("demo").innerHTML = ages.some(checkAdult);
}//true

[ 19.sort() ]

sort(): 方法用于对数组的元素进行排序。排序顺序可以是字母或数字,并按升序或降序。默认排序顺序为按字母升序。

array.sort( sortfunction)
返回值:对数组的引用。请注意,数组在原数组上进行排序,不生成副本。

代码示例(如下)

var array = [5,6,9,45,3,14];
array.sort((a,b) => a-b);
console.log(array);// [3, 5, 6, 9, 14, 45]

[ 20.toString() ]

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

注意: 数组中的元素之间用逗号分隔。

语法: toString()
返回值:数组中的每位元素

代码示例(如下)

let array = [1, 2, 3, 4];

console.log(array.toString());
//"1,2,3,4"

[ 21.splice() ]

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

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

语法:splice( index, howmany, item1,....., itemX)
start:必需。规定从何处添加/删除元素。
该参数是开始插入和(或)删除的数组元素的下标,必须是数字。
howmany:可选。规定应该删除多少元素。必须是数字,但可以是 "0"。
如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。
item1,..., itemX:可选。要添加到数组的新元素
返回值:如果删除一个元素,则返回一个元素的数组。 如果未删除任何元素,则返回空数组。

代码示例(如下)

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

[ 22.valueOf() ]

valueOf(): 方法返回 Array 对象的原始值,valueOf()方法不会改变原数组。

语法: valueOf()
返回值:valueOf() 返回数组值

代码示例(如下)

 let array = [1, 2, 3];
console.log(array.valueOf()); //1,2,3
ES6的数组方法总结

[ 1.copyWithin() ]

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

语法: array.copyWithin(target, start, end)
target: 必需。复制到指定目标索引位置。
start:可选。元素复制的起始位置。
end可选。停止复制的索引位置 (默认为 array.length)。如果为负值,表示倒数。
返回值:数组。

代码示例(如下)

//复制数组的前面两个元素到第三和第四个位置上:
var fruits = ["Banana", "Orange", "Apple", "Mango", "Kiwi", "Papaya"];
fruits.copyWithin(2, 0, 2);
//Banana,Orange,Banana,Orange,Kiwi,Papaya

[ 2.entries() ]

entries() 方法返回一个数组的迭代对象,该对象包含数组的键值对 (key/value)。迭代对象中数组的索引值作为 key, 数组元素作为 value。

语法: array.entries()
返回值:数组迭代对象

代码示例(如下)

var arr= ['a', 'b', 'c'];
let a = arr.entries();
console.log(a)
//Array Iterator

[ 3.fill() ]

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

语法: array.fill(value, start, end)
value:必需。填充的值。
start:可选。开始填充位置。
end:可选。停止填充位置 (默认为 array.length)
返回值:数组

代码示例(如下)

var arr= ['a', 'b', 'c'];
let a = arr.fill("come");
console.log(a)
//['come', 'come', 'come']

[ 4.find() ]

find() 方法返回通过测试(函数内判断)的数组的第一个元素的值。find() 方法为数组中的每个元素都调用一次函数执行:

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

  • 如果没有符合条件的元素返回 undefined

语法: array.find(function(currentValue, index, arr),thisValue)

callbackFn: 必需,数组中每个元素需要调用的函数。
currentValue:必选,当前元素。
index:可选,当前元素的索引
arr:可选,当前元素所属的数组对象
thisValue:可选,传递给函数的值一般用 "this" 值。如果这个参数为空, "undefined" 会传递给 "this" 值

返回值:数组迭代对象

代码示例(如下)

var array = [5,6,9,45,3,14];
let age = array.find(a => a > 18);
console.log(age);// 45

[ 5.findIndex() ]

findIndex() :查找出第一个符合条件的数组元素的索引,没找到则返回-1

语法: array.findIndex(function(currentValue, index, arr),thisValue)

callbackFn: 必需,数组中每个元素需要调用的函数。
currentValue:必选,当前元素。
index:可选,当前元素的索引
arr:可选,当前元素所属的数组对象
thisValue:可选,传递给函数的值一般用 "this" 值。如果这个参数为空, "undefined" 会传递给 "this" 值

返回值:符合条件的返回元素索引,不符合的返回【-1】

代码示例(如下)

 let ary = [9,6,3,4]
    let index = ary.findIndex((val,index) => val<4)
    console.log(index)//2

[6.form() ]

form():它可以接收一个伪数组作为参数,返回值为数组转换后的结果,这个结果是一个真正的数组。

语法:Array.from(object, mapFunction, thisValue)
object:必需,需转换数组的对象
mapFunction:可选,数组中每个元素要调用的函数
thisValue:可选,映射函数(mapFunction)中的this对象
返回值:数组对象

代码示例(如下)

 let arrlike ={
        '0' :1,
        '1': 2,
        '2': 3,
        length:3
    }
let ary = Array.from(arrlike,item => item*2)
    console.log(ary)//[2, 4, 6]

[ 7.includes() ]

includes():方法验证是否包含某个给定的值。

语法:
arr.includes(searchElement) arr.includes(searchElement, fromIndex)
searchElement:必须。需要查找的元素值。
fromIndex:可选。从该索引处开始查找 searchElement。如果为负值,则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。
返回值:布尔值。如果找到指定值返回 true,否则返回 false。

代码示例(如下)

 let arr = [1,8,6]
    let res = arr.includes(10)
    console.log(res)  //True表示包含给定的值,false表示不包含给定的值
   //false

[ 8.keys() ]

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

语法: array.keys()
返回值:一个数组可迭代对象

代码示例(如下)

 var arr= ['a', 'b', 'c'];
let a = arr.keys("come");
console.log(a)
//Array Iterator

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值