js数组方法(大全)
迪丽瓦拉
2025-06-01 02:43:27
0
  1. Array.at() 通过下标获取数值

Array.at(index) 获取对应下标的数值,index为下标值,正数时从左往右查询,负数时从右往左查询(默认值为0)。示例如下:

const array1 = [5, 12, 8, 130, 44];let index = 2;console.log(`Using an index of ${index} the item returned is ${array1.at(index)}`);
// Expected output: "Using an index of 2 the item returned is 8"index = -2;console.log(`Using an index of ${index} item returned is ${array1.at(index)}`);
// Expected output: "Using an index of -2 item returned is 130"

  1. Array.concat 数组拼接

拼接两个数组或者多个数组,返回的是新数组,不会改变原数组。示例如下:

const array1 = ['a', 'b', 'c'];
const array2 = ['d', 'e', 'f'];
const array3 = array1.concat(array2);console.log(array3);
// Expected output: Array ["a", "b", "c", "d", "e", "f"]

  1. Array.entries() 数组迭代器对象

会一层一层迭代下下去,该对象包含数组中每个索引的键/值对。示例如下:

示例一:
const array1 = ['a', 'b', 'c'];const iterator1 = array1.entries();console.log(iterator1.next().value);
// Expected output: Array [0, "a"]console.log(iterator1.next().value);
// Expected output: Array [1, "b"]console.log(iterator1.next().value);
// Expected output: Array [2, "c"]示例二:
const a = ["a", "b", "c"];for (const [index, element] of a.entries()) {console.log(index, element);
}
// 0 'a'
// 1 'b'
// 2 'c'示例三:
const array = ["a", "b", "c"];
const arrayEntries = array.entries();for (const element of arrayEntries) {console.log(element);
}// [0, 'a']
// [1, 'b']
// [2, 'c']

  1. Array.every() 判断指定元素是否通过测试(返回值为布尔值)

Array.every (element, index. array) 方法测试一个数组内的所有元素是否都能通过指定函数的测试。它返回一个布尔值。有三个参数,对应如下:

element

index

array

数组中正在处理的当前元素

下标

调用 every 的当前数组

示例如下:

示例一:
const isBelowThreshold = (currentValue) => currentValue < 40;const array1 = [1, 30, 39, 29, 10, 13];console.log(array1.every(isBelowThreshold));
// Expected output: true示例二
function isBigEnough(element, index, array) {return element >= 10;
}
[12, 5, 8, 130, 44].every(isBigEnough);   // false
[12, 54, 18, 130, 44].every(isBigEnough); // true

  1. Array.fill() 填充修改数组

Array.fill(value, statr, end ) 方法用一个固定值填充一个数组中从起始索引(默认为 0)到终止索引(默认为 array.length)内的全部元素。它返回修改后的数组。

value

statr

end

改变的值

改变的下标

示例如下:

console.log([1, 2, 3].fill(4)); // [4, 4, 4]
console.log([1, 2, 3].fill(4, 1)); // [1, 4, 4]
console.log([1, 2, 3].fill(4, 1, 2)); // [1, 4, 3]
console.log([1, 2, 3].fill(4, 1, 1)); // [1, 2, 3]
console.log([1, 2, 3].fill(4, 3, 3)); // [1, 2, 3]
console.log([1, 2, 3].fill(4, -3, -2)); // [4, 2, 3]
console.log([1, 2, 3].fill(4, NaN, NaN)); // [1, 2, 3]
console.log([1, 2, 3].fill(4, 3, 5)); // [1, 2, 3]
console.log(Array(3).fill(4)); // [4, 4, 4]

Array.filter() 数组过滤,筛选

Array.filter(element, index, array) 不会改变原数组,创建一个新的数组

element

index

array

数组中当前正在处理的元素。

正在处理的元素在数组中的索引。

调用了 filter() 的数组本身。

示例如下

示例一:
筛选排除对比小的值
function isBigEnough(value) {return value >= 10;
}const filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44]示例二:
找出下列输入所有质数
const array = [-3, -2, -1, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13];function isPrime(num) {for (let i = 2; num > i; i++) {if (num % i === 0) {return false;}}return num > 1;
}console.log(array.filter(isPrime)); // [2, 3, 5, 7, 11, 13]示例三:
在数组中搜索
const fruits = ['apple', 'banana', 'grapes', 'mango', 'orange'];/*** 根据搜索条件(查询)筛选数组项*/
function filterItems(arr, query) {return arr.filter((el) => el.toLowerCase().includes(query.toLowerCase()));
}console.log(filterItems(fruits, 'ap')); // ['apple', 'grapes']
console.log(filterItems(fruits, 'an')); // ['banana', 'mango', 'orange']

  1. Array.find() 返回测试中第一个满足的元素的值

Array.find(element, index, array) 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。

element

index

array

当前遍历到的元素。

当前遍历到的索引。

数组本身。

示例如下:

示例一:
const inventory = [{name: 'apples', quantity: 2},{name: 'bananas', quantity: 0},{name: 'cherries', quantity: 5},{name: 'cherries', quantity: 6}
];function isCherries(fruit) {return fruit.name === 'cherries';
}console.log(inventory.find(isCherries));
// { name: 'cherries', quantity: 5 }
// 只会返回满足条件的第一个数据示例二:
使用箭头函数和解构赋值
const inventory = [{name: 'apples', quantity: 2},{name: 'bananas', quantity: 0},{name: 'cherries', quantity: 5}
];const result = inventory.find(({ name }) => name === 'cherries');console.log(result) // { name: 'cherries', quantity: 5 }

  1. Array.findIndex() 查询到满足的条件,返回对应下标,否则返回-1

Array.findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引。若没有找到对应元素则返回 -1(下标从0开始)。

const array1 = [5, 12, 8, 130, 44];const isLargeNumber = (element) => element > 46;console.log(array1.findIndex(isLargeNumber));
// Expected output: 3const isLargeNumber = (element) => element > 144;console.log(array1.findIndex(isLargeNumber));
// Expected output: -1

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/findLast

相关内容

热门资讯

linux入门---制作进度条 了解缓冲区 我们首先来看看下面的操作: 我们首先创建了一个文件并在这个文件里面添加了...
C++ 机房预约系统(六):学... 8、 学生模块 8.1 学生子菜单、登录和注销 实现步骤: 在Student.cpp的...
A.机器学习入门算法(三):基... 机器学习算法(三):K近邻(k-nearest neigh...
数字温湿度传感器DHT11模块... 模块实例https://blog.csdn.net/qq_38393591/article/deta...
有限元三角形单元的等效节点力 文章目录前言一、重新复习一下有限元三角形单元的理论1、三角形单元的形函数(Nÿ...
Redis 所有支持的数据结构... Redis 是一种开源的基于键值对存储的 NoSQL 数据库,支持多种数据结构。以下是...
win下pytorch安装—c... 安装目录一、cuda安装1.1、cuda版本选择1.2、下载安装二、cudnn安装三、pytorch...
MySQL基础-多表查询 文章目录MySQL基础-多表查询一、案例及引入1、基础概念2、笛卡尔积的理解二、多表查询的分类1、等...
keil调试专题篇 调试的前提是需要连接调试器比如STLINK。 然后点击菜单或者快捷图标均可进入调试模式。 如果前面...
MATLAB | 全网最详细网... 一篇超超超长,超超超全面网络图绘制教程,本篇基本能讲清楚所有绘制要点&#...
IHome主页 - 让你的浏览... 随着互联网的发展,人们越来越离不开浏览器了。每天上班、学习、娱乐,浏览器...
TCP 协议 一、TCP 协议概念 TCP即传输控制协议(Transmission Control ...
营业执照的经营范围有哪些 营业执照的经营范围有哪些 经营范围是指企业可以从事的生产经营与服务项目,是进行公司注册...
C++ 可变体(variant... 一、可变体(variant) 基础用法 Union的问题: 无法知道当前使用的类型是什...
血压计语音芯片,电子医疗设备声... 语音电子血压计是带有语音提示功能的电子血压计,测量前至测量结果全程语音播报࿰...
MySQL OCP888题解0... 文章目录1、原题1.1、英文原题1.2、答案2、题目解析2.1、题干解析2.2、选项解析3、知识点3...
【2023-Pytorch-检... (肆十二想说的一些话)Yolo这个系列我们已经更新了大概一年的时间,现在基本的流程也走走通了,包含数...
实战项目:保险行业用户分类 这里写目录标题1、项目介绍1.1 行业背景1.2 数据介绍2、代码实现导入数据探索数据处理列标签名异...
记录--我在前端干工地(thr... 这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 前段时间接触了Th...
43 openEuler搭建A... 文章目录43 openEuler搭建Apache服务器-配置文件说明和管理模块43.1 配置文件说明...