JavaScript ES5 数组方法实战：indexOf、filter、forEach、map、reduce

`indexOf`方法 在JavaScript中，`indexOf`方法是一个非常实用的数组成员查找函数。它允许我们检查一个特定的元素是否存在于数组中，并返回该元素的索引。如果元素不存在，`indexOf`会返回-1。这个方法对于数组的搜索和过滤非常有用，尤其是在处理数据集合时。 例如，在给定的示例中： ```javascript var arr = ['apple', 'orange', 'pear']; console.log("found:", arr.indexOf('orange')); ``` 这行代码会输出`"found: 1"`，因为'orange'是数组中的第二个元素，其索引为1。 2) `filter` `filter`方法创建一个新的数组，其中包含通过测试的所有元素。这个测试通常是一个函数，用于判断元素是否满足某种条件。例如，我们可以找出数组中所有长度大于3的字符串： ```javascript var fruits = ['apple', 'orange', 'pear', 'banana']; var longFruits = fruits.filter(function(fruit) { return fruit.length > 3; }); console.log(longFruits); // 输出：['orange', 'banana'] ``` 在这个例子中，`filter`方法返回了一个新的数组，只包含长度大于3的水果名称。 3) `forEach` `forEach`方法对数组的每个元素执行一个提供的函数。这通常用于遍历数组并执行某种操作，而不需要显式地使用循环。例如，打印数组中的所有元素： ```javascript var numbers = [1, 2, 3, 4, 5]; numbers.forEach(function(number) { console.log(number); }); ``` 这段代码会依次打印出数组中的每一个数字。 4) `map` `map`方法创建一个新的数组，其结果是调用提供的函数的返回值。这个函数被应用于数组的每个元素。例如，将数组中的所有元素乘以2： ```javascript var numbers = [1, 2, 3, 4, 5]; var doubledNumbers = numbers.map(function(number) { return number * 2; }); console.log(doubledNumbers); // 输出：[2, 4, 6, 8, 10] ``` `map`方法不会改变原始数组，而是返回一个新的数组。 5) `reduce` `reduce`方法对数组中的每个元素执行一个函数，将其累积到单个返回值。这个函数接受两个参数：累积值和当前元素。例如，计算数组元素的总和： ```javascript var numbers = [1, 2, 3, 4, 5]; var sum = numbers.reduce(function(total, current) { return total + current; }, 0); console.log(sum); // 输出：15 ``` 在这里，初始累积值设置为0，然后函数每次迭代时将当前元素加到总和中。 总结 这五个方法——`indexOf`、`filter`、`forEach`、`map`和`reduce`——都是ECMAScript 5引入的增强数组处理的功能，它们极大地提高了处理数组的效率和便利性。随着现代浏览器对这些方法的广泛支持，开发者可以更轻松地利用它们来编写简洁、高效的代码，减少对额外库的依赖。通过熟练掌握这些方法，你可以提升你的JavaScript编程技能，更好地应对各种开发场景。