Javascript – 数组方法

javascript - 数组方法

JavaScript数组常用方法详解

本文将深入探讨JavaScript中常用的数组方法,涵盖数组元素的增删、查找、转换、排序、组合及迭代等操作。

一、元素添加与删除

push(): 向数组末尾添加一个或多个元素,并返回新数组的长度。

let fruits = ["apple", "banana"];fruits.push("cherry");console.log(fruits); // ["apple", "banana", "cherry"]

pop(): 删除并返回数组的最后一个元素。

fruits.pop();console.log(fruits); // ["apple", "banana"]

unshift(): 向数组开头添加一个或多个元素,并返回新数组的长度。

fruits.unshift("mango");console.log(fruits); // ["mango", "apple", "banana"]

shift(): 删除并返回数组的第一个元素。

fruits.shift();console.log(fruits); // ["apple", "banana"]

二、查找与搜索

立即学习“Java免费学习笔记(深入)”;

indexOf(): 返回数组中第一个与指定元素相匹配的索引值,如果未找到则返回 -1。

let numbers = [10, 20, 30, 40];console.log(numbers.indexOf(20)); // 1

includes(): 检查数组是否包含指定的值,返回布尔值。

console.log(numbers.includes(30)); // trueconsole.log(numbers.includes(50)); // false

三、数组转换

map(): 创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。

let numbers = [1, 2, 3];let squares = numbers.map(num => num * num);console.log(squares); // [1, 4, 9]

filter(): 创建一个新数组,其包含通过提供的函数测试的所有元素。

let evenNumbers = numbers.filter(num => num % 2 === 0);console.log(evenNumbers); // [2]

reduce(): 将数组中的所有元素累加为一个值。

let sum = numbers.reduce((acc, num) => acc + num, 0);console.log(sum); // 6

四、排序

sort(): 对数组进行排序(默认按字母顺序)。 数字排序需要自定义比较函数。

let fruits = ["banana", "apple", "cherry"];fruits.sort();console.log(fruits); // ["apple", "banana", "cherry"]let numbers = [10, 5, 20];numbers.sort((a, b) => a - b); // 升序console.log(numbers); // [5, 10, 20]

reverse(): 反转数组中元素的顺序。

fruits.reverse();console.log(fruits); // ["cherry", "banana", "apple"]

五、组合与提取

concat(): 连接两个或多个数组。

let arr1 = [1, 2];let arr2 = [3, 4];let combined = arr1.concat(arr2);console.log(combined); // [1, 2, 3, 4]

slice(): 提取数组的一部分,不修改原数组。

let numbers = [10, 20, 30, 40];let sliced = numbers.slice(1, 3);console.log(sliced); // [20, 30]

splice(): 从数组中添加或删除元素。

let fruits = ["apple", "banana", "cherry"];fruits.splice(1, 1, "orange", "grape");console.log(fruits); // ["apple", "orange", "grape", "cherry"]

六、数组迭代

forEach(): 为数组中的每个元素执行一次提供的函数。

let numbers = [1, 2, 3];numbers.forEach(num => console.log(num * 2)); // 2, 4, 6

七、其他实用方法

join(): 将数组元素连接成一个字符串。

let fruits = ["apple", "banana", "cherry"];console.log(fruits.join(", ")); // "apple, banana, cherry"

find(): 返回数组中满足提供的测试函数的第一个元素的值。

let numbers = [10, 20, 30];let result = numbers.find(num => num > 15);console.log(result); // 20

findIndex(): 返回数组中满足提供的测试函数的第一个元素的索引。

console.log(numbers.findIndex(num => num > 15)); // 1

flat(): 将嵌套数组“展平”成一个单层数组。

let nested = [1, [2, 3], [4, [5]]];console.log(nested.flat(2)); // [1, 2, 3, 4, 5]

通过学习以上方法,您可以高效地操作JavaScript数组,完成各种数据处理任务。

以上就是Javascript – 数组方法的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1501020.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
系统集成测试:确保组件之间的无缝协作
上一篇 2025年12月19日 23:00:58
趋势网络编程
下一篇 2025年12月19日 23:01:12

相关推荐

  • Laravel 8 注册成功但登录失败的解决方案

    本文针对 Laravel 8 中使用 php artisan ui:auth 生成的认证系统,注册功能正常但登录功能失效的问题,提供了一种解决方案。通过重写 LoginController 中的 username() 方法,将认证字段从默认的 email 修改为 username,从而解决登录失败的…

    2026年9月22日
    000
  • rm -rf 误删文件?别急,或许有救!

    rm -rf 误删文件?别急,或许有救!rm -rf 误删文件?别急,或许有救!rm -rf 误删文件?别急,或许有救!rm -rf 误删文件?别急,或许有救!

    立即采取行动! 在生产环境中,我们应尽量避免进行风险操作。但如果不慎犯错,如何挽救呢?让我分享一个故事:上周我为了打包一个应用,需要整理Ubuntu 16.04上的线上数据,不小心删除了一个数据文件,幸而最终有惊无险,现记录如下。 extundelete 我的恢复计划主要依赖于一个工具——extun…

    2026年9月22日 用户投稿
    000
  • MySQL复杂查询语句写作技巧_Sublime环境中编写多表关联逻辑

    MySQL复杂查询语句写作技巧_Sublime环境中编写多表关联逻辑MySQL复杂查询语句写作技巧_Sublime环境中编写多表关联逻辑MySQL复杂查询语句写作技巧_Sublime环境中编写多表关联逻辑MySQL复杂查询语句写作技巧_Sublime环境中编写多表关联逻辑

    提升mysql多表查询性能与可读性的方法包括:1. 优化索引,确保join和where字段有合适索引,理解复合索引左前缀原则;2. 使用cte分解逻辑,使结构清晰易维护;3. 利用sublime text插件如sqltools、sublimelinter提升编写效率;4. 拆解复杂逻辑,逐步构建查询…

    2026年9月22日 用户投稿
    100
  • itextpdf freemarker渲染

    关于打印pdf操作的需求,经过研究,发现以下两种方法: 在现有的模板上进行编辑,这种方法操作难度较大。而通过FreeMarker生成静态页面,然后转换为HTML,操作更为顺畅。动态生成PDF的方法在网上参考较多,经过对比,我认为使用FreeMarker结合IText生成PDF最为简单。参考链接为ht…

    2026年9月22日
    300
  • 使用空值合并运算符为数组元素设置默认值

    本文将介绍如何使用 PHP 的空值合并运算符 (??) 为数组元素设置默认值,尤其是在处理用户输入时。 通过该运算符,可以在变量值为 null 或不存在时,提供一个备选值,从而简化代码并提高可读性。我们将通过一个实际的 Laravel 邮件发送示例,演示如何在请求参数中缺失主题时,设置默认主题。 空…

    2026年9月22日
    600
  • Reinstalling Alpine Linux on a Lighthouse Instance

    Start by creating an instance with Debian or your preferred operating system. Log into the instance. Download the Arch Linux ISO for booting. Although…

    2026年9月22日
    000
  • 小米双11正式开启!覆盖全品类 单品最高可省4000元

    10月13日,小米官方宣布“小米双11”大促活动全面启动。此次活动涵盖小米全品类产品,优惠力度空前,部分单品最高直降4000元。 在手机产品线中,小米最新旗舰大折叠屏MIX Fold 4迎来大幅让利,最高降价1000元,最终到手价为7999元。搭载顶级影像系统的旗舰机型小米15 Ultra也下调50…

    2026年9月22日
    400
  • 使用 Spring Boot Test @Sql 注解通过掩码描述文件的方法

    在 Spring Boot 测试中,我们经常使用 @Sql 注解来执行 SQL 脚本,以便在测试前准备数据或在测试后清理数据。 通常的用法如下: @Sql(scripts = “/folder/my_favourite_script.sql”)@Testpublic void myTest() { …

    2026年9月22日
    100
  • 3000元以下最具性价比手机出炉:iQOO拿下三大榜首

    3000元以下最具性价比手机出炉:iQOO拿下三大榜首3000元以下最具性价比手机出炉:iQOO拿下三大榜首3000元以下最具性价比手机出炉:iQOO拿下三大榜首3000元以下最具性价比手机出炉:iQOO拿下三大榜首

    9月2日消息,今天,安兔兔公布了2025年8月份手机性价比排行榜。 在3000元以下价位段,iQOO表现尤为突出,包揽了三个价位区间的榜首,成为该价位段的最大赢家。 在0-999元价位,iQOO Z10x(8GB+128GB)以744.6的性价比得分位列第一。该价位机型主要面向入门用户,iQOO Z…

    2026年9月22日 用户投稿
    000
  • MySQL执行时间分析与诊断_MySQL性能瓶颈精准定位

    MySQL执行时间分析与诊断_MySQL性能瓶颈精准定位MySQL执行时间分析与诊断_MySQL性能瓶颈精准定位MySQL执行时间分析与诊断_MySQL性能瓶颈精准定位MySQL执行时间分析与诊断_MySQL性能瓶颈精准定位

    mysql性能瓶颈定位与分析需从慢查询日志、执行计划、实时监控等多维度入手。1. 开启慢查询日志,设置slow_query_log=1、指定日志路径及阈值long_query_time,通过mysqldumpslow分析日志找出最慢sql;2. 使用explain命令查看sql执行计划,重点关注ty…

    2026年9月22日 用户投稿
    300
  • MySQL中如何使用存储过程提高业务逻辑复用_示例讲解?

    MySQL中如何使用存储过程提高业务逻辑复用_示例讲解?MySQL中如何使用存储过程提高业务逻辑复用_示例讲解?MySQL中如何使用存储过程提高业务逻辑复用_示例讲解?MySQL中如何使用存储过程提高业务逻辑复用_示例讲解?

    存储过程在 mysql 中用于封装业务逻辑,提升复用性并减少网络传输。它是一组预定义的 sql 语句集合,通过参数调用实现功能,如查询订单及计算消费总额。其优点包括提高执行效率、统一数据操作逻辑、增强安全性和便于维护。例如,输入客户 id 即可返回订单信息与总消费金额。优化方式有:1. 使用 out…

    2026年9月22日 用户投稿
    300
  • VSCode配置C++项目环境 新手必看VSCode搭建C++教程

    答案:在VSCode中配置C++环境需安装MinGW-w64编译器并将其路径加入系统环境变量,安装VSCode的C/C++扩展以支持代码补全和调试,通过tasks.json配置编译任务,指定g++路径及编译参数,再通过launch.json配置调试任务,设置gdb调试器路径和程序输出路径,确保头文件…

    2026年9月22日
    200
  • 如何使用DeepSpeed训练AI大模型?大规模模型训练的优化技巧

    DeepSpeed通过ZeRO等技术突破显存限制,实现大模型高效训练。它采用ZeRO-1/2/3分级优化,分别对优化器状态、梯度和参数进行分区,显著降低单卡显存占用;结合混合精度、梯度累积和CPU/NVMe卸载进一步节省资源。同时集成流水线并行与张量并行,支持多维并行策略协同,使万亿参数模型训练在普…

    2026年9月22日
    200
  • PHP 表单验证:确保 HTML select 下拉菜单已正确选择非默认选项

    本文将详细介绍如何在 PHP 后端对 HTML select 下拉菜单进行有效验证,确保用户选择了非默认选项。我们将探讨常见的验证误区,并提供一个简洁高效的解决方案,通过检查 $_POST 数据来判断用户是否已做出有效选择,从而避免表单提交无效数据,提升用户体验和数据准确性。 在构建 web 表单时…

    2026年9月22日
    300
  • python 基准测试(cProfile kcachegrind line_profiler memory_profiler)

    learn from 《python高性能(第2版)》 类似工具:pycharm profile对函数调用效率进行测试 1. 例子 一个圆周运动的动画 代码语言:javascript代码运行次数:0运行复制 from matplotlib import pyplot as pltfrom matpl…

    2026年9月22日
    200
  • MySQL查询缓存配置及性能_MySQL重复查询响应速度提升

    MySQL查询缓存配置及性能_MySQL重复查询响应速度提升MySQL查询缓存配置及性能_MySQL重复查询响应速度提升MySQL查询缓存配置及性能_MySQL重复查询响应速度提升MySQL查询缓存配置及性能_MySQL重复查询响应速度提升

    mysql查询缓存已不适用于现代应用场景,尤其在8.0版本中被彻底移除。它仅适合读多写少、数据几乎不变的静态查询,通过内存直接返回结果提升性能;但在数据频繁更新时,因基于表级的缓存失效机制,每次写操作都会清空相关缓存,导致频繁重建缓存并消耗大量cpu资源,形成性能瓶颈。此外,sql语句匹配严格、内存…

    2026年9月22日 用户投稿
    500
  • 使用MockWebServer对FeignClient进行单元测试

    本文详细阐述了如何利用Spring Cloud LoadBalancer和MockWebServer对FeignClient进行高效单元测试。通过在测试配置中动态注册MockWebServer实例,并将其作为FeignClient的服务发现目标,开发者可以精确模拟后端API的行为,包括各种HTTP响…

    2026年9月22日
    100
  • Linux系统中文件属性和权限实战操作

    Linux系统中文件属性和权限实战操作Linux系统中文件属性和权限实战操作Linux系统中文件属性和权限实战操作Linux系统中文件属性和权限实战操作

    —–原本今天的文章是昨天晚上就要更新的,但是由于昨天晚上下班回到住的地方,发现停电了,所以就没写成。今天是在上一篇文章–linux系统中文件类型的基础上,继续进行深入的学习。好了,直接开干。 一、文件的操作权限: 1、在这之前我想还是很有必要介绍对文件的操作权限(…

    2026年9月22日 用户投稿
    300
  • PHP中为数组元素设置默认值的最佳实践:使用Null合并运算符

    本教程将介绍如何在PHP中为数组元素设置默认值,尤其当源数据可能为空或缺失时。通过利用PHP 7+提供的Null合并运算符(??),可以简洁高效地实现这一需求,避免冗长的条件判断,提高代码可读性和健壮性。 引言:处理缺失或空值时的数组赋值 在Web开发中,我们经常需要从用户请求、数据库查询或其他外部…

    2026年9月22日
    100
  • Laravel 8 登录后重定向至仪表盘的策略与实践

    本教程详细阐述了在 Laravel 8 中实现用户登录后重定向到仪表盘的多种策略。我们将探讨如何通过配置 LoginController 的 $redirectTo 属性、利用 RouteServiceProvider 定义常量以及在自定义登录方法中进行精确控制来管理重定向流程。文章还涵盖了相关中间…

    2026年9月22日
    100

发表回复

登录后才能评论
关注微信