当前位置: 首页 > news >正文

7个常用的JavaScript数组操作进阶用法

文章目录

    • 1、查找数组中的最大值
      • 方法一:使用 Math.max 和展开运算符
      • 方法二:使用 for 循环逐一比较
    • 2、查找数组中的第二大值
      • 方法一:排序后取第二大值
      • 方法二:遍历找到第二大值
    • 3、去除数组中的重复项
    • 4、合并两个有序数组并保持有序
    • 5、旋转数组
    • 6、判断两个数组是否相等
    • 7、总结

1、查找数组中的最大值

给定一个数字数组,如何找出其中的最大值

方法一:使用 Math.max 和展开运算符

这是最直接的解决方案。
可以使用 Math.max,并通过展开运算符将数组元素传递进去。这样不仅语法简洁,而且逻辑也很清晰。

const numbers = [1, 5, 3, 9, 2];
function findLargest(arr) {return Math.max(...arr);
}
console.log(findLargest(numbers)); // 输出:9

解析:在这里,Math.max(…arr) 将数组解包成单个参数传入 Math.max,一行代码就能返回最大值。

“如果数组很大,这种方法还适用吗?” 展开运算符可能会在大数组上有性能问题,因为它会消耗较多的内存。在百万级别的数组上,更推荐使用 for
循环。

方法二:使用 for 循环逐一比较

使用 for 循环的方式,虽然这看起来不像是“最简单”的方法,但它能够处理任何长度的数组,无论多大,都不会受到展开运算符带来的内存限制。

const numbers = [1, 5, 3, 9, 2];
function findLargest(arr) {let max = arr[0];for (let i = 1; i < arr.length; i++) {if (arr[i] > max) {max = arr[i];}}return max;
}
console.log(findLargest(numbers)); // 输出:9

解释:在这个例子中,我们通过 for 循环从头遍历数组,将当前最大值保存在 max 中。当遇到更大的值时,更新 max。

这种方法在时间复杂度上是 O(n),而且不会引发内存溢出,是一种更加稳妥的处理方式。

2、查找数组中的第二大值

“如何要找到数组中的第二大值呢?” 下面展示几种不同的方法。

方法一:排序后取第二大值

最直观的方法就是将数组降序排列,然后取第二个值。

const numbers = [1, 5, 3, 9, 7];
function secondLargest(arr) {let sorted = arr.sort((a, b) => b - a);return sorted[1];
}
console.log(secondLargest(numbers)); // 输出:7

分析:数组排序后,sorted[1] 就是第二大值。不过排序的时间复杂度为 O(n log n),且会改变原数组,不是最高效的方法。

方法二:遍历找到第二大值

如果希望更高效,可以在一次遍历中找到第二大值。

使用两个变量 max 和 secondMax 来记录最大值和次大值,可以在不排序的情况下得到结果。

const numbers = [1, 5, 3, 9, 7];
function findSecondLargest(arr) {let max = -Infinity;let secondMax = -Infinity;for (let num of arr) {if (num > max) {secondMax = max;max = num;} else if (num > secondMax && num < max) {secondMax = num;}}return secondMax;
}
console.log(findSecondLargest(numbers)); // 输出:7

解释:这段代码在一次循环中完成,时间复杂度为 O(n)。max 记录当前最大值,secondMax> 记录次大值。每次遇到新的最大值时,更新这两个变量,保证 secondMax 是最大值之外的最大元素。

3、去除数组中的重复项

方法:使用 Set 去重
使用 Set 是最快捷的方式,Set 会自动去除重复元素。

const numbers = [1, 2, 2, 3, 4, 4, 5];
function removeDuplicates(arr) {return [...new Set(arr)];
}
console.log(removeDuplicates(numbers)); // 输出:[1, 2, 3, 4, 5]

解析:在这里,Set 自动去重,然后再用展开运算符将 Set 转换回数组。操作简单且性能优越,特别适用于中小规模的数据处理。

4、合并两个有序数组并保持有序

将两个已排序的数组合并并保持顺序。

concat 和 sort 是一种快速实现的方式。

方法:使用 concat 和 sort

const arr1 = [1, 3, 5];
const arr2 = [2, 4, 6];
function mergeArrays(arr1, arr2) {return arr1.concat(arr2).sort((a, b) => a - b);
}
console.log(mergeArrays(arr1, arr2)); // 输出:[1, 2, 3, 4, 5, 6]

解释:concat 拼接数组,然后用 sort 进行升序排列。这种方法简单直观,但如果有大量数据时,concat 的内存消耗和 sort> 的效率需要注意。

5、旋转数组

“写一个函数,将数组右移 k 次。”
这要求数组中的每个元素向右“移动”指定的次数。比如,给定 [1, 2, 3, 4, 5],右移 2 次后数组应变成 [4, 5, 1, 2, 3]。这类旋转操作在数据处理和算法应用中十分常见。

使用 slice 和 concat 拼接旋转后的数组。

const arr = [1, 2, 3, 4, 5];
function rotateArray(arr, k) {k = k % arr.length; // 防止 k 超出数组长度return arr.slice(-k).concat(arr.slice(0, -k));
}
console.log(rotateArray(arr, 2)); // 输出:[4, 5, 1, 2, 3]

代码详解处理超长旋转次数:首先,k = k % arr.length 这一行确保旋转次数不会超出数组长度。比如当 k = 7 时,这段代码将> k 变为 2(7 % 5 = 2),这相当于只旋转了 2 次,避免了多余的操作。

分割数组:接下来,用 slice 方法将数组分成两个部分,分别取出数组的尾部和前面的部分:arr.slice(-k) 用来取出数组最后 k> 个元素。比如当 k = 2 时,arr.slice(-2) 会返回 [4, 5]。arr.slice(0, -k)> 则获取数组的前面部分,不包括最后 k 个元素。对 [1, 2, 3, 4, 5] 使用 arr.slice(0, -2),结果就是 [1,> 2, 3]。拼接旋转后的数组:最后,你用 concat 将这两个部分组合起来,把尾部的 [4, 5] 放到 [1, 2, 3]> 的前面,完成右移操作。整个代码执行后得到 [4, 5, 1, 2, 3],实现了右移 2 次的效果。

详细说明:假设 arr = [1, 2, 3, 4, 5],k = 2。我们需要将数组右移 2 次,让 [4, 5] 出现在数组开头。使用> slice(-2) 得到 [4, 5]。使用 slice(0, -2) 得到 [1, 2, 3]。把这两个部分拼接起来,得到最终的 [4,> 5, 1, 2, 3]。

关键点总结循环优化:通过 k % arr.length 确保旋转次数不会超过数组长度,从而优化效率。
分割和拼接:利用 slice 和 concat 组合,可以轻松实现数组的旋转效果。

6、判断两个数组是否相等

方法:逐个元素比较

const arr1 = [1, 2, 3];
const arr2 = [1, 2, 3];
function arraysEqual(arr1, arr2) {if (arr1.length !== arr2.length) return false;for (let i = 0; i < arr1.length; i++) {if (arr1[i] !== arr2[i]) return false;}return true;
}
console.log(arraysEqual(arr1, arr2)); // 输出:true
console.log(arraysEqual([1, 2, 3], [1, 2, 4])); // 输出:false

解析:逐个元素对比可以确保内容和顺序一致。此方法适用于小型数组,因为时间复杂度为 O(n)。

7、查找数组中和为特定值的所有数对
这涉及到去重和优化算法的问题。

方法:使用 Set 记录和查找补数

const arr = [1, 2, 4, 3, 5, 7, 8, 9];
const target = 10;
function findPairs(arr, target) {let result = [];let seen = new Set();for (let num of arr) {let complement = target - num;if (seen.has(complement)) {result.push([num, complement]);}seen.add(num);}return result;
}console.log(findPairs(arr, target)); // 输出:[[3, 7], [2, 8], [1, 9]]

解析:通过 Set 记录遍历过的数,找到符合条件的数对。

利用查找补数的方式,避免重复数对,且比双重循环效率更高。

7、总结

上面7中常用 JavaScript 操作数组方法,从最简单的查找最大值到复杂的数对查找,涵盖了去重、排序、旋转等经典操作;希望能帮到你!!!

在这里插入图片描述


别人可以拷贝我的模式,不能拷贝我的苦难,不能拷贝我不断往前的激情。


相关文章:

7个常用的JavaScript数组操作进阶用法

文章目录 1、查找数组中的最大值方法一&#xff1a;使用 Math.max 和展开运算符方法二:使用 for 循环逐一比较 2、查找数组中的第二大值方法一&#xff1a;排序后取第二大值方法二&#xff1a;遍历找到第二大值 3、去除数组中的重复项4、合并两个有序数组并保持有序5、旋转数组…...

Spark的Standalone集群环境安装

一.简介 与MR对比&#xff1a; 概念MRYARNSpark Standalone主节点ResourceManagerMaster从节点NodeManagerWorker计算进程MapTask&#xff0c;ReduceTaskExecutor 架构&#xff1a;普通分布式主从架构 主&#xff1a;Master&#xff1a;管理节点&#xff1a;管理从节点、接…...

Android Glide动态apply centerCropTransform(),transition withCrossFade动画,Kotlin

Android Glide动态apply centerCropTransform(),transition withCrossFade动画,Kotlin import android.graphics.Bitmap import android.os.Bundle import android.widget.ImageView import androidx.appcompat.app.AppCompatActivity import com.bumptech.glide.Glide import …...

shukla方差和相对平均偏差

参考资料&#xff1a;实用统计学【李奉令】 Eberhart-Russell模型、Shukla模型、相对平均偏差稳定性分析比较 相对平均偏差在品种稳定性分析中的作用 1、Shukla方差 生物统计中&#xff0c;用于描述一个群体离散程度的统计量有离差、方差、极差等&#xff0c; 国内品种区域试…...

双指针(二)双指针到底是怎么个事

一.有效的三角形个数 有效的三角形个数 class Solution {public int triangleNumber(int[] nums) {Arrays.sort(nums);int i0,end nums.length-1;int count 0;for( i end;i>2;i--){int left 0;int right i-1;while(left<right){if(nums[left]nums[right]>nums…...

vscode通过remote-ssh连接远程开发机

文章目录 安装扩展注意事项:tips其他参数安装扩展 安装VS Code和SSH-Remote扩展:首先,需要确保你已经在本地计算机上安装了VS Code,并且在扩展市场中搜索并安装了"Remote - SSH"扩展。配置SSH:在本地计算机上,打开VS Code的命令面板(使用快捷键"Ctrl+Shi…...

uniapp实现H5和微信小程序获取当前位置(腾讯地图)

之前的一个老项目&#xff0c;使用 uniapp 的 uni.getLocation 发现H5端定位不准确&#xff0c;比如余杭区会定位到临平区&#xff0c;根据官方文档初步判断是项目的uniapp的版本太低。 我选择的方式不是区更新uniapp的版本&#xff0c;是直接使用高德地图的api获取定位。 1.首…...

SQL HAVING子句

SQL 是一种基于“面向集合”思想设计的语言。HAVING 子句是一个聚合函数&#xff0c;用于过滤分组结果。 1 实践 1.1 缺失的编号 图 连续编号记录表t_seq_record 需求&#xff1a;判断seq 列编号是否有缺失。 SELECT 存在缺失的编号 AS res FROM t_seq_record HAVING COUN…...

计算机视觉基础:OpenCV库详解

&#x1f493; 博客主页&#xff1a;瑕疵的CSDN主页 &#x1f4dd; Gitee主页&#xff1a;瑕疵的gitee主页 ⏩ 文章专栏&#xff1a;《热点资讯》 计算机视觉基础&#xff1a;OpenCV库详解 计算机视觉基础&#xff1a;OpenCV库详解 计算机视觉基础&#xff1a;OpenCV库详解 引…...

UI自动化测试工具(超详细总结)

&#x1f345; 点击文末小卡片 &#xff0c;免费获取软件测试全套资料&#xff0c;资料在手&#xff0c;涨薪更快 常用工具 1、QTP&#xff1a;商业化的功能测试工具&#xff0c;收费&#xff0c;可用于web自动化测试 2、Robot Framework&#xff1a;基于Python可扩展的关…...

AJAX 全面教程:从基础到高级

AJAX 全面教程&#xff1a;从基础到高级 目录 什么是 AJAXAJAX 的工作原理AJAX 的主要对象AJAX 的基本用法AJAX 与 JSONAJAX 的高级用法AJAX 的错误处理AJAX 的性能优化AJAX 的安全性AJAX 的应用场景总结与展望 什么是 AJAX AJAX&#xff08;Asynchronous JavaScript and XML…...

ONLYOFFICE 8.2测评:功能增强与体验优化,打造高效办公新体验

引言 随着数字化办公需求的不断增长&#xff0c;在线办公软件市场竞争愈加激烈。在众多办公软件中&#xff0c;ONLYOFFICE 无疑是一个颇具特色的选择。它不仅支持文档、表格和演示文稿的在线编辑&#xff0c;还通过开放的接口与强大的协作功能&#xff0c;吸引了众多企业和个人…...

Science Robotics 综述揭示演化研究新范式,从机器人复活远古生物!

在地球46亿年的漫长历史长河中&#xff0c;生命的演化过程充满着未解之谜。如何从零散的化石证据中还原古生物的真实面貌&#xff1f;如何理解关键演化节点的具体过程&#xff1f;10月23日&#xff0c;Science Robotics发表重磅综述&#xff0c;首次系统性提出"古生物启发…...

uni-app表格带分页,后端处理过每页显示多少条

uni-app表格带分页&#xff0c;后端处理过每页可以显示多少条&#xff0c;一句设置好了每页显示的数据量&#xff0c;不需要钱的在进行操作&#xff0c;在进行对数据的截取 <th-table :column"column" :listData"data" :checkSort"checkSort"…...

基于STM32设计的矿山环境监测系统(NBIOT)_262

文章目录 一、前言1.1 项目介绍【1】开发背景【2】研究的意义【3】最终实现需求【4】项目硬件模块组成1.2 设计思路【1】整体设计思路【2】上位机开发思路1.3 项目开发背景【1】选题的意义【2】摘要【3】国内外相关研究现状【5】参考文献1.4 开发工具的选择【1】设备端开发【2】…...

【初阶数据结构与算法】线性表之链表的分类以及双链表的定义与实现

文章目录 一、链表的分类二、双链表的实现1.双链表结构的定义2.双链表的初始化和销毁初始化函数1初始化函数2销毁函数 3.双链表的打印以及节点的申请打印函数节点的申请 4.双链表的头插和尾插头插函数尾插函数 5.双链表的查找和判空查找函数判空函数 6.双链表的头删和尾删头删函…...

219页华为供应链管理:市场预测SOP计划、销售预测与存货管理精要

一、华为ISC供应链管理 华为的集成供应链&#xff08;ISC&#xff09;领先实践和SISC&#xff08;Siyuan Integrated Supply Chain&#xff09;架构体现了其在供应链管理领域的深度和广度&#xff0c;以下是7点关键介绍&#xff1a; 全面的供应链视野&#xff1a;华为ISC涵盖…...

mac 安装指定的node和npm版本

mac 安装指定的node和npm版本 0.添加映像&#xff1a; export N_NODE_MIRRORhttps://npmmirror.com/mirrors/node 1、使用 npm 全局安装 n npm install -g n 如果报了sudo chown -R 502:20 "/Users/xxx/.npm" sudo npm install -g n 2、根据需求安装指定版本的 node …...

为什么分布式光伏规模是6MW为界点?

安科瑞 Acrel-Tu1990 最近&#xff0c;能源局颁布了一项规定&#xff0c;明确指出6兆瓦&#xff08;MW&#xff09;及以上的分布式光伏电站必须实现自发自用&#xff0c;自行消纳电力。多个省份的能源局进一步规定&#xff0c;规模超过6兆瓦的电站需按照集中式管理进行操作。此…...

arm64架构的linux 配置vm_page_prot方式

在 ARM64 架构上&#xff0c;通过 vm_page_prot 属性可以修改 UIO 映射内存的访问权限及缓存策略&#xff0c;常见的有非缓存&#xff08;Non-cached&#xff09;、写合并&#xff08;Write Combine&#xff09;等。下面是 ARM64 常用的 vm_page_prot 设置及其对应的操作方式。…...

vue3 + naive ui card header 和 title 冲突 bug

背景描述 最近发现一个 naive ui 上的问题&#xff0c;之前好好的&#xff0c;某一次升级后就出现了一个 bug&#xff0c;Modal 使用 card 布局后&#xff0c;Header Solt 下面的内容不见了&#xff0c;变成了 title&#xff0c;因为这个 solt 里面是有操作 action 的&#xf…...

Ubuntu 22.04.5 LTS配置 bond

本次纯实验&#xff0c;不会讲解bond功能&#xff0c;配置bond mode 1 和 mode 4 如何配置 确定内核模块是否加载 实验使用root用户权限&#xff0c;非root用户使用sudo 调用root权限 rootubuntu22:~# lsmod | grep bonding rootubuntu22:~# modprobe bonding rootubuntu22:~# …...

100种算法【Python版】第58篇——滤波算法之卡尔曼滤波

本文目录 1 算法步骤2 算法示例2.1 示例描述2.2 python代码3 算法应用:二维运动目标跟踪问题滤波算法是用于从信号中提取有用信息、去除噪声或估计系统状态的技术。在时间序列分析、信号处理和控制系统中,滤波算法起着关键作用。 1 算法步骤 卡尔曼滤波(Kalman Filter)的…...

关于几种卷积

1*1卷积 分组卷积&深度可分离卷积 空洞卷积、膨胀卷积 转置卷积 https://zhuanlan.zhihu.com/p/80041030 https://yinguobing.com/separable-convolution/#fn2 11的卷积可以理解为对通道进行加权&#xff0c;对于一个通道来说&#xff0c;每个像素点加权是一样的&am…...

51单片机教程(五)- LED灯闪烁

1 项目分析 让输入/输出口的P1.0或P1.0~P1.7连接的LED灯闪烁。 2 技术准备 1、C语言知识点 1 运算符 1 算术运算符 #include <stdio.h>int main(){// 算术运算符int a 13;int b 6;printf("%d\n", ab); printf("%d\n", a-b); printf("%…...

VUE3中Element table表头动态展示合计信息(不是表尾合计)

一、背景 原型上需要对两个字段动态合计&#xff0c;输出摘要信息 原先想到是的Element的 :summary-method&#xff0c;发现不是动态&#xff0c;所以换监听来实现 二、vue代码 <el-table v-model"loading" :data"itemList"><el-table-column la…...

git重置的四种类型(Git Reset)

git区域概念 1.工作区:IDEA中红色显示文件为工作区中的文件 (还未使用git add命令加入暂存区) 2.暂存区:IDEA中绿色(本次还未提交的新增的文件显示为绿色)或者蓝色(本次修改的之前版本提交的文件但本次还未提交的文件显示为蓝色)显示的文件为暂存区中的文件&#xff08;使用了…...

【Java集合面试1】说说Java中的HashMap原理?

Java中的HashMap是一种基于哈希表的Map接口实现&#xff0c;它存储的内容是键值对&#xff08;key-value&#xff09;映射。HashMap允许空键&#xff08;null&#xff09;和空值&#xff08;null&#xff09;&#xff0c;并且它的键值对没有顺序。以下是HashMap的一些关键工作原…...

万字长文解读机器学习——决策树

&#x1f33a;历史文章列表&#x1f33a; 机器学习——损失函数、代价函数、KL散度机器学习——特征工程、正则化、强化学习机器学习——常见算法汇总机器学习——感知机、MLP、SVM机器学习——KNN机器学习——贝叶斯机器学习——决策树机器学习——随机森林、Bagging、Boostin…...

内网环境,基于k8s docer 自动发包

背景&#xff1a;生产环境是内网&#xff0c;无法连接外部git环境&#xff0c;需要上传tar包打成镜像&#xff0c;然后发布。 简单写了个脚本&#xff0c;记录下方便复用。 将tar包和脚本拷贝到同一个目录下。 使用方式&#xff1a; tar 包名称格式&#xff1a;服务名-版本号…...

12306网站谁建设的/百度提交网址入口

Spring框架是个轻量级的Java EE框架。所谓轻量级&#xff0c;是指不依赖于容器就能运行的。 Spring以IOC、AOP为主要思想&#xff0c;其中IoC&#xff0c;Inversion of Control 指控制反转或反向控制。在Spring框架中我们通过配置创建类对象&#xff0c;由Spring在运行阶段实例…...

wordpress调用文章列表图片为背景/海淀区seo搜索引擎优化企业

出品&#xff5c;虎嗅商业消费组作者&#xff5c;黄青春题图&#xff5c;视觉中国“团购、外卖、直播&#xff0c;从抢夺商家资源到配送运力的补位&#xff0c;抖音蚕食本地生活的步伐正在提速。”一位分析师向虎嗅表示&#xff0c;在抖音凶猛攻势下&#xff0c;本地生活赛道格…...

win8导航网站模板/广告公司取名字参考大全

德这个东西&#xff0c;空洞,难量化 不同的组织&#xff0c;机构&#xff0c;不同的国家&#xff0c;种族&#xff0c;民族&#xff0c;不同的宗教 标准不同&#xff0c;同一件事放在不同的时代&#xff0c;评价可能截然相反 毁人誉己是违反道德的一个具体案例 人的一生要经历多…...

云盘做网站文件/优化大师专业版

1. ThreadLocal 底层是采用的弱引用&#xff0c;所以 currentResources.isEmpty()为空后&#xff0c;需要调用remove&#xff0c;否则会造成内存泄漏。 2. try(InputStream inputStream encodedResource.getResource().getInputStream()) …… 这样把这个语句放在try的括号内…...

网站用什么字体做正文/如何快速提升自己

PHP类的属性不能被赋值为变量的原因 ps&#xff1a;本人亲测&#xff0c;阿里云2核4G5M的服务器性价比很高&#xff0c;新用户一块多一天&#xff0c;老用户三块多一天&#xff0c;最高可以买三年&#xff0c;感兴趣的可以戳一下&#xff1a;阿里云折扣服务器 成员属性声明时…...

学设计的网站有哪些/华夏思源培训机构官网

Oracle软件在安装维护过程中长要和操作用户组(OS user group)打交道&#xff0c;从早前的只有oracle用户和dba组发展到今天11gr2中的grid用户和asm组&#xff0c;Oracle管理的日新月异可见一斑。我们在单实例(single-instance)环境中常用的三个操作用户组&#xff0c;分别是:oi…...