CodeGym /课程 /Frontend SELF ZH /数组迭代方法

数组迭代方法

Frontend SELF ZH
第 38 级 , 课程 1
可用

8.1 forEach() 方法

JavaScript 中的数组迭代方法提供了强大的工具来处理数组,可以对它们的元素进行各种操作。在这个主题中,我们将讨论关键的迭代方法,包括 forEach()map()filter()reduce()some()every()find()findIndex()

forEach() 方法对数组的每个元素执行一次指定的函数。这个方法不会返回一个新数组并且不能中断。

语法:

    
      array.forEach(function(element, index, array) {
        // 函数体
      });
    
  

例子:

forEach() 方法遍历数组 numbers[] 的每个元素,并输出其索引和值。

JavaScript
    
      const numbers = [1, 2, 3, 4, 5];

      numbers.forEach((number, index) => {
          console.log(`Index: ${index}, Value: ${number}`);
      });

      // 输出:
      // Index: 0, Value: 1
      // Index: 1, Value: 2
      // Index: 2, Value: 3
      // Index: 3, Value: 4
      // Index: 4, Value: 5
    
  

8.2 map() 方法

map() 方法调用指定函数对数组的每个元素进行处理,生成一个新数组。

语法:

    
      const newArray = array.map(function(element, index, array) {
        // 函数体
        return new_value;
      });
    
  

转换函数也可以使用箭头函数的形式:

    
      const newArray = array.map((element, index, array) => new_value);
    
  

例子:

map() 方法创建一个新的数组 squared[],其中包含数组 numbers[] 中数值的平方。

JavaScript
    
      const numbers = [1, 2, 3, 4, 5];
      const squared = numbers.map(number => number * number);

      console.log(squared); // [1, 4, 9, 16, 25]
    
  

8.3 filter() 方法

filter() 方法创建一个新数组,包含通过指定函数测试的所有元素。

    
      const newArray = array.filter(function(element, index, array) {
        // 函数体
        return condition;
      });
    
  

过滤函数也可以使用箭头函数的形式:

    
      const newArray = array.filter((element, index, array) => condition);
    
  

例子:

filter() 方法创建一个新的数组 evenNumbers[],只包含数组 numbers[] 中的偶数。

JavaScript
    
      const numbers = [1, 2, 3, 4, 5];
      const evenNumbers = numbers.filter(number => number % 2 === 0);

      console.log(evenNumbers); // [2, 4]
    
  

8.4 reduce() 方法

reduce() 方法对数组的每个元素(从左到右)应用一个函数,将其简化为单个值。

语法:

    
      const result = array.reduce(function(accumulator, current, index, array) {
        // 函数体
        return new_accumulator_value;
      }, initialValue);
    
  

累加函数也可以使用箭头函数的形式:

    
      const result = array.reduce((accumulator, current, index, array) =>
        new_value, initialValue
      );
    
  

例子:

reduce() 方法将数组 numbers[] 归约为单个值 sum,将数组的所有元素相加。

JavaScript
    
      const numbers = [1, 2, 3, 4, 5];
      const sum = numbers.reduce((acc, number) => acc + number, 0);

      console.log(sum); // 15
    
  

8.5 some() 方法

方法 some() 检查数组中是否至少有一个元素满足指定函数中的条件。返回 truefalse

语法:

    
      const result = array.some(function(element, index, array) {
        // 函数体
        return condition;
      });
    
  

检查函数也可以使用箭头函数的形式:

    
      const result = array.some((element, index, array) => condition);
    
  

例子:

some() 方法检查数组 numbers[] 中是否至少有一个偶数,并返回 true

JavaScript
    
      const numbers = [1, 2, 3, 4, 5];
      const hasEvenNumber = numbers.some(number => number % 2 === 0);

      console.log(hasEvenNumber); // true
    
  

8.6 every() 方法

every() 方法检查数组中的所有元素是否都满足提供的函数的条件。返回 truefalse

语法:

    
      const result = array.every(function(element, index, array) {
        // 函数体
        return condition;
      });
    
  

检查函数也可以使用箭头函数的形式:

    
      const result = array.every((element, index, array) => condition);
    
  

例子:

every() 方法检查数组 numbers[] 的所有元素是否都是正数,并返回 true

JavaScript
    
      const numbers = [1, 2, 3, 4, 5];
      const allPositive = numbers.every(number => number > 0);

      console.log(allPositive); // true
    
  

8.7 find() 方法

find() 方法返回满足提供测试函数的第一个数组元素。如果没有元素满足条件,则返回 undefined

语法:

    
      const result = array.find(function(element, index, array) {
        // 函数体
        return condition;
      });
    
  

检查函数也可以使用箭头函数的形式:

    
      const result = array.find((element, index, array) => condition);
    
  

例子:

find() 方法返回数组 numbers[] 中的第一个偶数。

JavaScript
    
      const numbers = [1, 2, 3, 4, 5];
      const firstEven = numbers.find(number => number % 2 === 0);

      console.log(firstEven); // 2
    
  

8.8 findIndex() 方法

findIndex() 方法返回满足提供的测试函数的第一个数组元素的索引。如果没有元素满足条件,则返回 -1

语法:

    
      const result = array.findIndex(function(element, index, array) {
        // 函数体
        return condition;
      });
    
  

检查函数也可以使用箭头函数的形式:

    
      const result = array.findIndex((element, index, array) => condition);
    
  

例子:

findIndex() 方法返回数组 numbers[] 中第一个偶数的索引。

JavaScript
    
      const numbers = [1, 2, 3, 4, 5];
      const firstEvenIndex = numbers.findIndex(number => number % 2 === 0);

      console.log(firstEvenIndex); // 1
    
  
评论
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION