五个强大的 JavaScript 数组方法。
全文请点击此处查看。
数组是编程中非常常见的数据结构,许多现代编程语言都支持数组。通常,数组是将一组元素存储在连续内存位置的集合。在大多数编程语言中,这些元素是同一类型的。然而,在 JavaScript 中,数组中存储的元素不必是同一类型。
JavaScript 提供了大量可用于操作数组的方法。本文将讨论五种可以改进 JavaScript 数组使用方式的方法。
在 JavaScript 中创建数组
JavaScript 允许你用两种不同的方式创建数组。
方法一
let arr = new Array();
方法二
let arr = []
两种方法的效果相同,但是为了提高执行速度、简洁性和可读性,请使用第二种方法(数组字面量方法)。
数组方法
现在我们来看看五个强大的 JavaScript 数组方法。使用这些方法绝对能提高代码的可读性和运行速度。
我们将在示例中使用以下数组:
这是一个数组,每个索引位置都存储着一个对象。
filter() 方法
filter ()方法会创建一个新数组,其中包含所有通过filter()方法中提供的回调函数所实现的测试的元素。我们来看一下。
在回调函数内部,ticketPrice 检查数组中每个元素的值是否小于 100。如果回调函数返回true,则将该元素添加到新数组中。
map() 方法
map()方法会针对数组中的每个元素调用一次函数。调用函数的结果将用于创建一个新数组。
当您想要使用现有数组中的值创建新数组,或者想要从数组中提取特定值时,map() 方法非常有用。
假设我们想要获取所有电影的名称,我们可以这样做。
在回调函数中,我们会对 movies 数组中的每个元素执行该函数,并返回每个元素对应的电影名称。然后,我们会将该名称存储在movieNames array.
find() 方法
find ()方法返回数组中第一个通过测试的元素的值(测试以函数[回调]的形式提供)。
如果我们想了解电影《皇后与瘦子》的信息,我们会这样做。
` find ()`方法会返回回调函数返回值为true的第一个数组元素的值。一旦返回true,它就不会再检查数组中的其余元素。
forEach() 方法
`forEach()`方法的工作方式与 `for` 循环类似,可以代替 `for` 循环使用。它会对数组中的每个元素调用一次函数。之后,您可以对给定数组的元素执行任何类型的操作。`forEach ()`方法与之前的方法不同之处在于,它不会创建新数组。
让我们遍历电影数组,并打印出每部电影的名称。
使用forEach()方法可以更轻松、更简洁地遍历数组。
reduce() 方法
reduce ()方法对数组中的每个元素执行reducer函数(由您提供),从而产生一个存储在累加器中的输出值。
如果我们想计算所有电影票价格(ticketPrice)的总和,该怎么办?你可以使用 for 循环或 forEach() 遍历数组,并将数组中所有元素的 ticketPrice 相加。但是,使用reduce()方法可以更轻松地完成这项工作。
这样做是这样的。
reducer 函数的返回值被赋给累加器,累加器的值在数组的每次迭代中都被记住,并最终成为最终的、唯一的结果值。
这0是赋予的初始值accumulator。
以上就是五个能够显著提升你在 JavaScript 中使用数组效率的方法。在数组中使用 `filter()`、`map()`、`find()`、`forEach()` 和 `reduce()` 方法,可以让你用更少的代码实现更多功能,并显著提高效率。
感谢阅读!下次再见,思考、学习、创造、循环往复!
来源
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array
https://www.w3schools.com/jsref/jsref_obj_array.asp
https://www.geeksforgeeks.org/javascript-array-map-method/
https://www.geeksforgeeks.org/javascript-tutorial/#array
文章来源:https://dev.to/taslangraham/ Five-powerful-javascript-array-methods-57mi






