分享15个JavaScript的重要数组方法

分享15个JavaScript的重要数组方法

目录

1、ForEach

2、Map

3、Filter

4、Find

5、FindIndex

6、Reduce

7、Every

8、Some

9、 Sort

10、Flat

11、 Reverse

12、Include

13、Fill

14、At

15、 Concat

前言;

我们会在构建的每个应用程序中使用数组。它有几种方法,其中一些非常令人困惑。我列出了 15 种,我们应该掌握的数组方法,因为它们经常派上用场。

数组方法的重要一点是有些是可变的,有些是不可变的。在决定针对特定问题使用哪种方法时,务必牢记这一点。

此列表中的大多数数组方法都采用类似的回调作为参数。第一个参数是当前项,第二个参数是索引,第三个是整个数组。现在我们已经解决了这个问题,让我们从列表开始:

1、ForEach

循环遍历数组中的每个元素并执行回调函数。

const arr = [1, 2, 3]; arr.forEach(num => console.log(num)); // Console: 1, 2, 3 2、Map

循环遍历数组中的每个元素并执行回调函数。使用回调函数的返回值创建一个新数组。

const arr = [1, 2, 3, 4, 5]; const areEven = arr.map(num => num % 2 === 0); console.log(areEven); // Console: [false, true, false, true, false] 3、Filter

循环遍历数组中的每个元素,并仅选择符合条件的元素。根据所选元素返回一个新数组。

const arr = [1, 2, 3, 4, 5]; const evenNumbers = arr.filter(num => num % 2 === 0); console.log(evenNumbers); // Console [2, 4] 4、Find

查找数组中满足条件的第一个元素。如果没有找到,将返回 undefined。

const arr = [1, 2, 3, 4, 5]; const firstEvenNumber = arr.find(num => num % 2 === 0); console.log(firstEvenNumber); // Console [2] 5、FindIndex

与前面的方法类似,它返回满足给定条件的第一个元素的索引。如果没有找到,则返回 -1。

const arr = [1, 2, 3, 4, 5]; const firstEvenNumberIdx = arr.findIndex(num => num % 2 === 0); console.log(firstEvenNumberIdx); 6、Reduce

这是一种高级方法,可用于组合数组的元素。主要区别在于回调将累加器作为第一个参数。回调的返回值成为下一次迭代的累加器。

const arr = [1, 2, 3, 4, 5]; // `acc` is the value of the accumulator // the acccumulator is return value of the previous callback // the second argument i.e `0` is the default value const sum = arr.reduce((acc, num) => acc + num, 0); console.log(sum); // Console: 15 7、Every

此方法接受一个返回布尔值的回调。如果条件对数组中的所有元素都有效,那么 Every() 将返回 true。

const arr = [1, 2, 3, 4, 5]; const areAllEven = arr.every(num => num % 2 === 0); console.log(areAllEven); // Console: false 8、Some

像前面的方法一样,这个方法也接受一个返回布尔值的回调。如果条件对至少一个元素有效,Some() 将返回 true。

const arr = [1, 2, 3, 4, 5]; const isOneEven = arr.some(num % 2 === 0); console.log(isOneEven); // true 9、 Sort

这是一种用于对数组中的元素进行排序的方法。

默认情况下,它按升序对数组进行排序。它需要一个回调函数,有两个元素——a 和 b。如果 a 小于 b,则返回 -1,否则返回 1。

如果它们相等,则返回 0。

const arr = [1, 2, 3, 4, 5]; const descendingArr = arr.sort((a, b) => b - a); console.log(descendingArr);

请记住,与其他数组方法不同,sort 会改变数组。

10、Flat

Flat 用于将嵌套数组展平为单个数组。您可以指定将数组展平的深度。

const arr = [[[1, 2], [3]], [4, 5]]; const flattenedArr = arr.flat(4); console.log(flattenedArr); // Console [1, 2, 3, 4, 5] 11、 Reverse

反转数组中元素的顺序。

const arr = [1, 2, 3, 4, 5]; const reversedArr = arr.reverse(); console.log(reversedArr); // Console [5, 4, 3, 2, 1] 12、Include

如果数组中存在元素,则此方法返回 true。

const arr = [1, 2, 3, 4, 5]; console.log(arr.includes(5)); // true console.log(arr.includes(10)); // false 13、Fill

fill 方法将数组的元素设置为给定值。当我想使用 map/forEach 方法特定次数时,我喜欢使用此方法。

const emptyArr = new Array(5); // The problem with this is that you get `[empty x 10]` // You need real values to map over it. const filledArr = emptyArr.fill(3); // Console [3, 3, 3, 3, 3] 14、At

此方法返回给定索引的元素。这与访问(即 arr[1])元素的传统方式之间的区别在于它也支持负索引。

const arr = [1, 2, 3, 4, 5]; console.log(arr.at(1)); // 2 console.log(arr.at(-1)); // 5 // Important: Negative indices start from `1`, positive indices start from `0`. 15、 Concat

此方法用于组合两个数组。

const arr1 = [1, 2, 3, 4, 5]; const arr2 = [6, 7, 8, 9, 10]; console.log(arr1.concat(arr2)); // Console [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

到此这篇关于分享15个JavaScript的重要数组方法的文章就介绍到这了,更多相关JS数组方法内容请搜索易知道(ezd.cc)以前的文章或继续浏览下面的相关文章希望大家以后多多支持易知道(ezd.cc)!

推荐阅读

    虾类安装经验分享!

    虾类安装经验分享!,,虾类安装经验分享: 1,机箱的电源光盘应该接近代理价格,而内存和硬盘的价格是在互联网上找到的即时价格。主板套件,视频卡

    未知软件异常应用程序错误解决方案

    未知软件异常应用程序错误解决方案,,我有很多朋友的电脑未知软件异常应用程序错误的问题,对于异常未知的软件异常中的应用一般提示(0xc00000

    小米手机安装的应用程序包在哪里

    小米手机安装的应用程序包在哪里,,问题: 下载小米手机系统的安装文件在哪里 答案uff1a 下载应用程序包位置:SD卡>下载。 (摘自:小米手册:米

    应用程序对象

    应用程序对象,,应用程序对象是一个应用程序级对象,用于在所有用户之间共享信息,并且在Web应用程序运行期间可以保存数据。 应用的性质: 方法

    电脑wifi共享密码|电脑wifi密码分享

    电脑wifi共享密码|电脑wifi密码分享,,1. 电脑wifi密码分享打开设置,点击蜂窝网络,开启蜂窝数据按钮,个人热点,开启允许其它人加入按钮,点击无线