ES6 数组常用方法

99 阅读2分钟

开启掘金成长之旅!这是我参与「掘金日新计划 · 2 月更文挑战」的第 13 天,点击查看活动详情

ES6 数组常用方法

Array.filter

filter 过滤掉数组中不满足条件的值,返回一个新数组,不改变原数组的值。

var arr = [1,2,3,4];
arr.filter((item,index,arr) => {
    return item > 2 //新数组为[3,4]
})

Array.find

这个方法是返回数组中符合条件的第一个元素,否则就返回 undefined

let a = [1,2,3,4,5];
let b = a.find(item => item > 2);
console.log(b) // 3

Array.findIndex

这个方法是返回数组中符合条件的第一个元素的索引值,否则就返回-1 let a = [1,2,3,4,5]; let b = a.findIndex(item => item > 2); console.log(b) // 2 符合条件的为元素 3 它的索引为 2

Array.from()

将类似数组的对象(array-like object)和可遍历(iterable)的对象转为真正的数组

const bar = ["a", "b", "c"];
Array.from(bar);
// ["a", "b", "c"]

Array.from('foo');
// ["f", "o", "o"]

Array.includes

includes(),判断数组是否存在有指定元素,参数:查找的值(必填)、起始位置,可以替换 ES5 时代的 indexOf 判断方式。indexOf 判断元素是否为 NaN,会判断错误。

var a = [1, 2, 3];
let bv = a.includes(2); // true
let cv = a.includes(4); // false
var obj1 = {a: 1,b:3}
var arr = [1, NaN,obj1]
arr.includes(obj1)   //true
arr.indexOf(obj1)  //2
arr.includes(NaN)  //true
arr.indexOf(NaN)  //-1

Array.forEach()

forEach 遍历数组,无返回值,不改变原数组,仅仅只是遍历、常用于注册组件、指令等等。

var arr = [1,2,3,4];
arr.forEach((item,index,arr) => {
    console.log(item) //结果为1,2,3,4
})

Array.map()

map 遍历数组,返回一个新数组,不改变原数组的值。

var arr = [1,2,3,4];
arr.map((item,index,arr) => {
    return item*10 //新数组为10,20,30,40
})

Array.reduce

reduce 让数组的前后两项进行某种计算。然后返回其值,并继续计算。不改变原数组,返回计算的最终结果,从数组的第二项开始遍历。

var arr = [1,2,3,4];
arr.reduce((result,item,index,arr) => {
    console.log(result) // 1  3  6  result为上次一计算的结果
    console.log(item)  // 2  3  4
    console.log(index) // 1  2  3
    return result+item //最终结果为10
})

Array.some()

遍历数组每一项,有一项返回 true,则停止遍历,结果返回 true。不改变原数组

var arr = [1,2,3,4];
arr.some((item,index,arr) => {
    return item > 3 //结果为true
})

Array.every()

遍历数组每一项,每一项返回 true,则最终结果为 true。当任何一项返回 false 时,停止遍历,返回 false。

var arr = [1,2,3,4];
arr.every((item,index,arr) => {
return item > 1 //结果为 false
})

开启掘金成长之旅!这是我参与「掘金日新计划 · 2 月更文挑战」的第 13 天,点击查看活动详情