IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> JavaScript的重要数组方法 -> 正文阅读

[JavaScript知识库]JavaScript的重要数组方法

目录

1、forEach

2、map

3、filter

4、reduce

5、find

6、findIndex

7、every

8、some

9、 sort

10、flat

11、flatMap

12、reverse

13、includes

14、fill

15、at

16、 concat


1、forEach

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

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

2、map

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

const arr = [1, 2, 3, 4, 5];
const areEven = arr.map(num => num % 2 === 0);
console.log(areEven); // [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); // [2, 4]

4、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); // 15

5、find

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

const arr = [1, 2, 3, 4, 5];

const firstEvenNumber = arr.find(num => num % 2 === 0);

console.log(firstEvenNumber); // 2

6、findIndex

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

const arr = [1, 2, 3, 4, 5];

const firstEvenNumberIdx = arr.findIndex(num => num % 2 === 0);

console.log(firstEvenNumberIdx); // 1

7、every

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

const arr = [1, 2, 3, 4, 5];

const areAllEven = arr.every(num => num % 2 === 0);

console.log(areAllEven); // 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); // [ 5, 4, 3, 2, 1 ]

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

10、flat

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

const arr = [[[1, 2], [3]], [4, 5]];

const flattenedArr = arr.flat(4);

console.log(flattenedArr); // [1, 2, 3, 4, 5]

11、flatMap

该方法将函数应用于数组的每个元素,然后将结果压缩为一个新数组。它在一个函数中结合了flat()和map()。

const arr= [[1], [2], [3], [4], [5]];

const flatMapArr = arr.flatMap(item => item * 10); 

console.log(flatMapArr);  // [10, 20, 30, 40, 50]

12、reverse

反转数组中元素的顺序。

const arr = [1, 2, 3, 4, 5];

const reversedArr = arr.reverse();

console.log(reversedArr); // [5, 4, 3, 2, 1]

13、includes

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

注意:includes() 方法区分大小写。

const arr = [1, 2, 3, 4, 5];

console.log(arr.includes(5)); // true
console.log(arr.includes(10)); // false

14、fill

此方法的作用是使用一个固定值来替换数组中的元素。该固定值可以是字母、数字、字符串、数组等等。它还有两个可选参数,表示填充起来的开始位置(默认为0)与结束位置(默认为array.length)。译者注:fill() 方法用于将一个固定值替换数组的元素。

const arr = [1, 2, 3, 4, 5];

const fillArr = arr.fill(0, 1, 3);

console.log(fillArr); // [1, 0, 0, 4, 5]

15、at

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


const arr = [1, 2, 3, 4, 5];

console.log(arr.at(1)); // 2
console.log(arr.at(-1)); // 5

16、 concat

此方法用于连接两个或多个数组/值,它不会改变现有的数组。而仅仅返回被连接数组的一个新数组。

const arr1 = [1, 2, 3, 4, 5];
const arr2 = [6, 7, 8, 9, 10];

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

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2022-05-01 15:38:21  更:2022-05-01 15:39:07 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/23 23:00:35-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码