# 数组常用方法--数组迭代【第三弹】

119 阅读3分钟

这是我参与8月更文挑战的第21天,活动详情查看:8月更文挑战

前言

“八月的色彩是用金子铸就的,明亮而珍贵;八月的色彩是用阳光酿造的,芬芳而灿烂。”

未来的日子,愿你把自己调至最佳状态,缓缓努力,慢慢变好 Y(^o^)Y

本文接 数组常用的方法【第二弹】

数组迭代

map()

map 方法会给原数组中的每个元素都按顺序调用一次 callback 函数。callback 每次执行后的返回值(包括 undefined)组合起来形成一个新数组。

callback 函数会被自动传入三个参数:数组元素,元素索引,原数组本身。

var kvArray = [
  {key: 1, value: 10},
  {key: 2, value: 20},
  {key: 3, value: 30}
];

var reformattedArray = kvArray.map(function(obj) {
   var rObj = {};
   rObj[obj.key] = obj.value;
   return rObj;
});
console.log(reformattedArray)  //  [{1: 10}, {2: 20}, {3: 30}]

filter()

filter 为数组中的每个元素调用一次 callback 函数,并利用所有使得 callback 返回 true 或等价于 true 的值的元素创建一个新数组。

callback 函数会被自动传入三个参数:数组元素,元素索引,原数组本身。

filter 不会改变原数组,它返回过滤后的新数组。

function isBigEnough(element) {
  return element >= 10;
}
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44]

forEach()

forEach() 方法按升序为数组中含有效值的每一项执行一次 callback 函数,那些已删除或者未初始化的项将被跳过。

forEach 不会直接改变调用它的对象,但是那个对象可能会被 callback 函数改变

const items = ['item1', 'item2', 'item3'];
const copy = [];

items.forEach(function(item){
  copy.push(item);
});

every()

every 方法为数组中的每个元素执行一次 callback 函数,直到它找到一个会使 callback 返回 false 的元素。如果发现了一个这样的元素,every 方法将会立即返回 false。否则,callback 为每一个元素返回 trueevery 就会返回 true

every 和数学中的"所有"类似,当所有的元素都符合条件才会返回true。正因如此,若传入一个空数组,无论如何都会返回 true

[12, 5, 8, 130, 44].every(x => x >= 10); // false
[12, 54, 18, 130, 44].every(x => x >= 10); // true

some()

some() 为数组中的每一个元素执行一次 callback 函数,直到找到一个使得 callback 返回一个“真值”(即可转换为布尔值 true 的值)。如果找到了这样一个值,some() 将会立即返回 true。否则,some() 返回 false

some() 被调用时不会改变数组。

常用于判断数组元素中是否存在某个值

[2, 5, 7, 1, 6].some(x => x > 10);  // false
[11, 5, 7, 1, 6].some(x => x > 10); // true

find()

find方法对数组中的每一项元素执行一次 callback 函数,直至有一个 callback 返回 true。当找到了这样一个元素后,该方法会立即返回这个元素的值,否则返回 undefined

var fruits = [
    {name: 'apples', quantity: 2},
    {name: 'bananas', quantity: 0},
    {name: 'cherries', quantity: 5}
];

function findCherries(fruit) {
    return fruit.name === 'cherries';
}

console.log(fruits.find(findCherries)); // { name: 'cherries', quantity: 5 }

findIndex()

这个和find()类似,它返回找到的元素的位置索引,如果没有找到会返回-1

var fruits = ['apples', 'bananas', 'cherries'];
function findCherriesIndex(fruit) {
  return fruit === 'cherries';
}
console.log(fruits.find(findCherries)); // 2

flat()

flat() 方法会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。 语法: var newArray = arr.flat([depth]) depth 可选,指定要提取嵌套数组的结构深度,默认值为 1

该方法主要用于扁平化嵌套数组。flat() 方法会移除数组中的空项:

var arr1 = [1, 2, [3, 4]];
arr1.flat();
// [1, 2, 3, 4]

var arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat();
// [1, 2, 3, 4, [5, 6]]

var arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2);
// [1, 2, 3, 4, 5, 6]

// 移除数组中的空项
var arr4 = [1, 2, , 4, 5];
arr4.flat();
// [1, 2, 4, 5]

结语

如果这篇文章帮到了你,欢迎点赞👍和关注⭐️。

文章如有错误之处,希望在评论区指正🙏🙏。