js数组的方法

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档

文章目录

  • 一、push()&&pop() unshift()&&shift()
    • 1、push():向数组的末尾添加一个或多个元素,并返回新的长度
    • 2、pop():删除并返回数组的最后一个元素
    • 3、unshift():向数组的开头添加一个或多个元素,并返回新的长度
    • 4、shift():删除并返回数组的第一个元素
  • 二、splice():可进行增,删,改操作
    • 1、增:splice(start,0,item):向数组内添加/插入元素,并返回空数组
    • 2、删:splice(start,deleteNum):删除元素,并返回包含删除元素的数组
    • 3、改:splice(start,deleteNum,item) :从start下标开始,删除几个,并在该位置添加item。返回包含删除元素的数组。
  • 三、slice()
    • slice(start,end):返回的是被截取(删除的元素),不影响原数组。
  • 四、concat()&&join()
    • 1、concat():可以把两个数组里的元素拼接成一个新的数组,返回拼接后的新数组
    • 2、 join():数组转字符串,参数默认为逗号分隔符
  • 五、查
    • 1、indexOf(ele,start):用来查找元素在数组中第一次出现的位置,没找到返回-1。
    • 2、lastIndexOf(ele,start):从数组的末尾开始向前查找,没找到返回-1
    • 3、includes(ele,start) 用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false。
    • 4、find(function(currentValue,index,arr){}) 返回数组内符合条件的第一个值
    • 5、findIndex() 返回数组内符合条件的第一个值,默认返回的是索引,如果没有符合条件的元素返回 -1,Es6
  • 六、排序和数组反转
    • 1、sort()排序
    • 2、reverse()数组反转
  • 七、迭代(不改变原数组)
    • 1.some():数组中只要有一个元素通过了函数测试,就会返回true,否则返回false
    • 2.every(): 数组中只有所有元素通过了函数测试,才返回true,否则返回false
    • 3.forEach():没有返回值,只用来操作数据
    • 4.map():返回一个新数组
    • 5.filter():过滤数组成员,返回过滤后的新数组,遍历数组时将返回值为true的元素放在新数组中,如果没有符合条件的元素则返回空数组。
  • 八、reduce()&&reduceRight()【待完善】
    • 1、reduce():从左到右处理数组的每个成员,最终累计为一个值
    • 2、reduceRight():从右到左处理数组的每个成员,最终累计为一个值


一、push()&&pop() unshift()&&shift()

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

		let arr=['html','css','js']let len=arr.push('vue');console.log(arr);// ['html', 'css', 'js', 'vue']console.log(len);//4

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

		let arr=[1,2,3,4,5]let r=arr.pop(5)console.log(arr);//[1, 2, 3, 4]console.log(r);//5

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

 		let arr = ['html', 'css', 'js']let  ln= arr.unshift('vue');console.log(arr);// ['vue', 'html', 'css', 'js']console.log(ln);//4

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

		let arr = [1, 2, 3, 4, 5]let r = arr.shift(1)console.log(arr);//[ 2, 3, 4,5]console.log(r);//1

二、splice():可进行增,删,改操作

			语法:arr.splice(start,deleteNum,item)start:开始的下标deleteNum:要删除元素数量item:要插入数组的元素

1、增:splice(start,0,item):向数组内添加/插入元素,并返回空数组

 		let arr = ['html', 'css', 'js']arr.splice(1,0,'vue')console.log(arr);// ['html', 'vue', 'css', 'js']console.log(arr.splice(1, 0, 'vue'));//[]

2、删:splice(start,deleteNum):删除元素,并返回包含删除元素的数组

		let arr=[1,2,3,4,5,6]let a=arr.splice(0,3)console.log(arr);//[4,5,6]console.log(a);//[1,2,3]

3、改:splice(start,deleteNum,item) :从start下标开始,删除几个,并在该位置添加item。返回包含删除元素的数组。

		let arr=[1,2,3]let a=arr.splice(0,2,6,7)console.log(arr);//[6, 7, 3]console.log(a);//[1, 2]

三、slice()

slice(start,end):返回的是被截取(删除的元素),不影响原数组。

		start开始下标,end结束下标。从start下标开始截取,一直到end结束,不包括end。
		let arr=[1,2,3,4,5,6]let a=arr3.slice(0,2)console.log(arr);//[1, 2, 3, 4, 5, 6]console.log(a);//[1,2]

四、concat()&&join()

1、concat():可以把两个数组里的元素拼接成一个新的数组,返回拼接后的新数组

		let arr=[1,2,3]let arr1=[4,5,6]let newArr=arr.concat(arr1)console.log(newArr);//[1, 2, 3, 4, 5, 6]

2、 join():数组转字符串,参数默认为逗号分隔符

		let arr=[5,6,7,8]console.log(arr.join());//5,6,7,8console.log(arr.join(';'))//5;6;7;8console.log(arr);//[5,6,7,8]

五、查

1、indexOf(ele,start):用来查找元素在数组中第一次出现的位置,没找到返回-1。

	ele:要查找的元素,start:可选的整数参数。规定在数组中开始检索的位置

2、lastIndexOf(ele,start):从数组的末尾开始向前查找,没找到返回-1

		let arr = [1, 2, 3, 4, 5,4,2]console.log(arr.indexOf(7));//-1console.log(arr.indexOf(4));//3console.log(arr.indexOf(2));//1console.log(arr.indexOf(4,2));//3console.log(arr.lastIndexOf(7));//-1console.log(arr.lastIndexOf(4));//5console.log(arr.lastIndexOf(2));//6

3、includes(ele,start) 用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false。

		ele:要查找的元素start:可选的整数参数。规定在数组中开始检索的位置,如果为负值,则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。ES6新增
		let arr1=[1,2,3,4,5,4,2]console.log(arr.includes(3));//trueconsole.log(arr.includes(6));//falseconsole.log(arr.includes(3,-1));//falseconsole.log(arr.includes(3,-6));//true

4、find(function(currentValue,index,arr){}) 返回数组内符合条件的第一个值

		当前的值(currentValue)、当前的位置(index)、原数组(arr)Es6新增
    	let arr2=[4,5,6,7,8,1,2]let fResult=arr2.find(function(currentVal,index,arr2){return currentVal>5})let fResult1 = arr2.find(function (currentVal, index, arr2) {return currentVal >8})console.log(fResult);//6console.log(fResult1);//undefined

5、findIndex() 返回数组内符合条件的第一个值,默认返回的是索引,如果没有符合条件的元素返回 -1,Es6

		let arr2=[4,5,6,7,8,1,2]let result=arr2.findIndex(function(currentVal,index,arr2){return currentVal>5})let result1 = arr2.findIndex(function (currentVal, index, arr2) {return currentVal > 8})console.log(result);//2console.log(result1);//-1

六、排序和数组反转

1、sort()排序

方法用于对数组的元素进行排序

		let arr=[1,300,150,2]let newArr=arr.sort()console.log(newArr);//[1, 150, 2, 300]console.log(arr);//[1, 150, 2, 300]  
此时数组并没有按照数字大小顺序排序,而是按照字符编码顺序进行排序,要是完成排序,要使用排序函数
		let arr=[1,300,150,2]function sortNumber(a, b) { return a - b }//升序function decreaseNumber(a,b){return b - a}//降序let arr1=arr.sort(sortNumber)console.log(arr1);//[1, 2, 150, 300]let arr2=arr.sort(decreaseNumber)console.log(arr2);//[300, 150, 2, 1]

2、reverse()数组反转

		let arr = [1, 300, 150, 2]console.log(arr.reverse());//[2, 150, 300, 1]console.log(arr);//2, 150, 300, 1]

七、迭代(不改变原数组)

	  ele : 必需。当前元素index: 可选。当前元素的索引值。arr :  可选。当前元素所属的数组对象。thisArg: 可选。传递给函数的值一般用 "this" 值。如果这个参数为空, "undefined" 会传递给 "this" 值

1.some():数组中只要有一个元素通过了函数测试,就会返回true,否则返回false

	1.some()不会对空数组进行检测,不会改变原始数组,收到空数组返回false2.语法:arr.some(function(ele,index,arr){},thisArg)
		let arr=[4,5,6,7,8,9]let boo=arr.some(function(ele,index,arr){return ele>5})console.log(boo);//truelet boo1=arr.some(function(ele,index,arr){return ele<4})console.log(boo1);//false

2.every(): 数组中只有所有元素通过了函数测试,才返回true,否则返回false

	1.语法:arr.every(function(ele,index,arr){},thisArg)2.every()不会对空数组进行检测,不会改变原始数组,收到空数组返回true
		let arr=[4,5,6,7,8,9]let result=arr.every(function(ele,index,arr){return ele>5})console.log(result);//falselet result1=arr.every(function(ele,index,arr){return ele<10})console.log(result1);//true

3.forEach():没有返回值,只用来操作数据

	语法:arr.forEach(function(ele,index,arr){},thisArg)
		let arr=[7,8,9,6,2,1,3]arr.forEach(function(ele,index,arr){if(ele>5){console.log(ele);//7 8  9 6}})

4.map():返回一个新数组

	语法:arr.map(function(ele,index,arr){},thisArg)
	let arr=[7,8,9,6,2,1,3]let newArr=arr.map(function(ele,index,arr){return ele*2})console.log(newArr);//[14, 16, 18, 12, 4, 2, 6]

5.filter():过滤数组成员,返回过滤后的新数组,遍历数组时将返回值为true的元素放在新数组中,如果没有符合条件的元素则返回空数组。

  语法:arr.filter(function(ele,index,arr){},thisArg)
		let arr=[7,8,9,6,2,1,3]let newArr1=arr.filter(function(ele,index,arr){return ele>7})console.log(newArr1);//[8, 9]

八、reduce()&&reduceRight()【待完善】

1、reduce():从左到右处理数组的每个成员,最终累计为一个值

	语法:arr.reduce(function(total , cur , index , arr){}, initialValue)total :必需。初始值, 或者计算结束后的返回值。cur :必需。当前元素。index :可选。当前元素的索引。arr:可选。当前元素所属的数组对象。initialValue:可选。传递给函数的初始值。
			var arr = [1, 2, 3, 4, 5];var result = arr.reduce(function (total, cur, index, arr) {console.log("total:" + total + ",cur:" + cur + ",index:" + index);return total + cur;});console.log(result);//15         

2、reduceRight():从右到左处理数组的每个成员,最终累计为一个值

   语法:arr.reduceRight(function(total , cur , index , arr){}, initialValue)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/582725.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

地震烈度速报与预警工程成功案例的经验分享 | TDengine 技术培训班第一期成功落地

近日&#xff0c;涛思数据在成都开设了“国家地震烈度速报与预警工程数据库 TDengine、消息中间件 TMQ 技术培训班”&#xff0c;这次培训活动共分为三期&#xff0c;而本次活动是第一期。其目标是帮助参与者深入了解 TDengine 和 TMQ 的技术特点和应用场景&#xff0c;并学习如…

pybullet安装时出现fatal error C1083: 无法打开包括文件: “string.h”: No such file or directory

pybullet安装时出现fatal error C1083: 无法打开包括文件: “string.h”: No such file or directory 报错原文&#xff1a; -----CloneTreeCreator.cppD:\Program_Professional\Microsoft Visual Studio\2022\BuildTools\VC\Tools\MSVC\14.38.33130\include\cstring(11): fat…

uni-app获取音频播放时长

在uni-app中&#xff0c;你可以使用uni.createInnerAudioContext()来创建一个内部音频上下文&#xff0c;然后通过这个对象来获取音频的播放时长。以下是一个示例代码&#xff1a; // 创建一个内部音频上下文对象 const audioContext uni.createInnerAudioContext();// 设置要…

腾讯云服务器如何买(购买腾讯云服务器的详细步骤)

腾讯云服务器购买流程直接在官方秒杀活动上购买比较划算&#xff0c;在云服务器CVM或轻量应用服务器页面自定义购买价格比较贵&#xff0c;但是自定义购买云服务器CPU内存带宽配置选择范围广&#xff0c;活动上购买只能选择固定的活动机&#xff0c;选择范围窄&#xff0c;但是…

canal 数据同步组件

canal 数据异构组件 为啥要使用这个组件&#xff1f; 在更新DB的时候不同步更新到redis&#xff0c;es等数据库中&#xff0c;时间太久&#xff0c;而且可能会存在同步失败的问题&#xff0c;因此引入canal去拉取DB的数据&#xff0c;再去更新到redis&#xff0c;es等数据库中&…

LeetCode刷题笔记之字符串

一、反转字符串 1. 344【反转字符串】 **题目&#xff1a;**编写一个函数&#xff0c;其作用是将输入的字符串反转过来。输入字符串以字符数组 s 的形式给出。不要给另外的数组分配额外的空间&#xff0c;你必须原地修改输入数组、使用 O(1) 的额外空间解决这一问题。代码&am…

python初试六

之前了解了&#xff1a; 创建Django项目 数据库 模板 表格提交 admin管理页面 上面的功能模块允许我们做出一个具有互动性的站点&#xff0c;但无法验证用户的身份。我们这次了解用户验证部分。通过用户验证&#xff0c;我们可以根据用户的身份&#xff0c;提供不同的服务。 …

TiDB SQL调优案例TiFlash

背景 早上收到某系统的告警tidb节点挂掉无法访问&#xff0c;情况十万火急。登录中控机查了一下display信息&#xff0c;4个TiDB、Prometheus、Grafana全挂了&#xff0c;某台机器hang死无法连接&#xff0c;经过快速重启后集群恢复&#xff0c;经排查后是昨天上线的某个SQL导…

openwrt源码编译

下载openwrt源码 git clone https://github.com/openwrt/chaos_calmer.git // 官方下载地址 当前我们基于15.05版本开发&#xff0c;如果开发者想用最新的OpenWRT系统&#xff0c;可以下载 https://github.com/openwrt/openwrt.git git clone https://github.com/Ying-Yun/o…

OpenGL 绘制Mesh数据(Qt)

文章目录 一、简介二、实现代码三、实现效果一、简介 Mesh数据的结构主要就是点与三角面片,因此本质上仍然是对三角面片进行绘制。这里我们借助VCG这个库实现对Mesh数据的读取,这个库相对简单轻巧,很方便使用。 二、实现代码 由于修改的部分很多,我们逐一进行解释一下: --…

Seata 中封装了四种分布式事务模式,分别是: AT 模式, TCC 模式, Saga 模式, XA 模式,

文章目录 seata概述Seata 中封装了四种分布式事务模式&#xff0c;分别是&#xff1a;AT 模式&#xff0c;TCC 模式&#xff0c;Saga 模式&#xff0c;XA 模式&#xff0c; 今天我们来聊聊seata seata 概述 在微服务架构下&#xff0c;由于数据库和应用服务的拆分&#xff0c…

计算机专业校招常见面试题目总结

博主面试岗位包括&#xff1a;java开发、软件测试、测试开发等岗位&#xff0c;基于之前经历的面试总结出的一些常见题目。仅供参考&#xff0c;互相学习&#xff01;&#xff01; 八股&#xff1a;java开发、测试、测开岗位 Java技术栈&#xff1a;Java基础、JVM、数据结构、…

【SAM系列】Auto-Prompting SAM for Mobile Friendly 3D Medical Image Segmentation

论文链接&#xff1a;https://arxiv.org/pdf/2308.14936.pdf 核心&#xff1a; finetune SAM,为了不依赖外部prompt&#xff0c;通过将深层的特征经过一个编-解码器来得到prompt embedding&#xff1b;finetune完之后做蒸馏

PTA-感染人数

设某住宿区域是一个nn的方阵&#xff0c;方阵中的每个小方格为一个房间&#xff0c;房间里可能住一个人&#xff0c;也可能空着。第一天&#xff0c;某些房间中住着的人得了一种高传染性的流感&#xff0c;以后每一天&#xff0c;得流感的人会使其邻居&#xff08;住在其上、下…

76 Python开发-内外网收集Socket子域名DNS

目录 Python开发相关知识点本篇文章涉及知识点演示案例:IP&Whois&系统指纹获取代码段-外网CDN&子域名&端口扫描&交互代码段-外网IP&计算机名&存活主机&端口扫描代码段-内网Py格式解析环境与可执行程序格式转换-Pyinstaller 涉及资源&#xff1…

git 学习 之一个规范的 commit 如何写

最好的话做一件完整的事情就提交一次

WPF 显示gif动态图

WPF显示gif动态图有以下几种方式&#xff1a; 使用Storyboard使用WpfAnimatedGif(NuGet包管理器安装WpfAnimatedGif)使用ImageAnimator使用Winform控件PictureBox使用MediaElement通过GifBitmapDecoder解析GIF图片&#xff0c;获取gif帧数和每一帧数据&#xff0c;然后通过时间…

一种删除 KubeSphere 中一直卡在 Terminating 的 Namespace--KubeSphere Logging System的简单方法

文章目录 一、问题提出二、删除方法1&#xff0c;获取kubesphere-logging-syste的详细信息json文件2&#xff0c;编辑kubesphere-logging-system.json3&#xff0c;执行清理命令 三、检查结果 一、问题提出 在使用 KubeSphere 的时候发现有一个日志服务KubeSphere Logging Sys…

ARM CCA机密计算软件架构之设备分配(Device Assignment)

这个指南的前几节展示了领域提供的执行环境,它与正常世界的Rich OS、Hypervisor和TrustZone完全隔离。领域可以在初始化时完全通过认证,以确保其初始内容,并确保它在基于RME的平台上运行。 在大多数操作情况下,任何领域软件执行都需要访问系统中可用的设备。默认情况下,系…

MySQL-长事务详解

您好&#xff0c;我是码农飞哥&#xff08;wei158556&#xff09;&#xff0c;感谢您阅读本文&#xff0c;欢迎一键三连哦。 &#x1f4aa;&#x1f3fb; 1. Python基础专栏&#xff0c;基础知识一网打尽&#xff0c;9.9元买不了吃亏&#xff0c;买不了上当。 Python从入门到精…