什么是数组迭代 数组迭代有哪些方法

一、前言

以前对JS中的数组迭代还是模模糊糊的，今天想花点时间来在看一下基础原理及其方法，同时想把自己的一些总结也分享给大家。

二、什么是数组迭代

数组迭代就是对数组的每一项都进行相应的操作。

三、提前了解

在介绍数组迭代的方法之前呢，我们要先知道函数的参数：下面的数组迭代方法中的函数都只有三个参数，包括：项目值、项目索引和数组本身。当函数只是用value值时，即项目值，可以省略其他两个参数。

四、数组迭代的方法

1. array.forEach()  每个数组元素调用一次函数（回调函数）:
   查看代码

   var txt = "";
   var numbers = [45, 4, 9, 16, 25];
   numbers.forEach(myFunction);
   
   function myFunction(value, index, array) {
     txt = txt + value + "<br>"; 
   }
   
   //结果
   45
   4
   9
   16
   25

2. array.map()  通过对每一个数组元素执行函数来创建新的数组；对于没有值的元素不会执行函数并且执行函数后不会影响原来的数组：
   查看代码

   
   var numbers1 = [45, 4, 9, 16, 25];
   var numbers2 = numbers1.map(myFunction);
   
   function myFunction(value, index, array) {
     return value * 2;
   }
   
   //结果
   90,8,18,32,50

3. array.every()  检查数组所有的元素是否都满足函数条件，若都满足条件返回true，否则返回false：
   查看代码

   var numbers = [45, 4, 9, 16, 25];
   var allOver18 = numbers.every(myFunction);
   
   function myFunction(value, index, array) {
     return value > 18;
   }
   
   //结果
   false

4. array.some()  检查数组中某一些元素值是否都满足函数条件，若都满足条件返回true，否则返回false：
   查看代码

   var numbers = [45, 4, 9, 16, 25];
   var allOver18 = numbers.every(myFunction);
   
   function myFunction(value, index, array) {
     return value > 18;
   }
   
   //结果
   true

5. array.find()  返回满足函数条件的第一个数组元素的值：
   查看代码

   var numbers = [4, 9, 16, 25, 29];
   var first = numbers.find(myFunction);
   
   function myFunction(value, index, array) {
     return value > 18;
   }
   
   //结果
   25

6. array.findIndex()  返回满函数足条件的第一个数组元素的索引值：
   查看代码

   var numbers = [4, 9, 16, 25, 29];
   var first = numbers.find(myFunction);
   
   function myFunction(value, index, array) {
     return value > 18;
   }
   
   //结果
   3

7. array.filter()  返回满足条件的所有项的新数组：
   查看代码

   var numbers = [45, 4, 9, 16, 25];
   var over18 = numbers.filter(myFunction);
   
   function myFunction(value, index, array) {
     return value > 18;
   }
   
   //结果
   45,25

8. array.indexOf()  搜索数组元素值并返回其位置(返回第一个元素值)：
   查看代码

   var fruits = ["Apple", "Orange", "Apple", "Mango"];
   var a = fruits.indexOf("Apple");
   
   //结果
   0

    

声明：笔记来源于W3SCHOOL