javaScript:数组方法(增删/提取类/截取/操作方法等)

news/2024/5/10 1:39:54/文章来源:https://blog.csdn.net/qq_52799985/article/details/132306488

目录

一.数组的增删方法

1.push()数组末尾添加元素

解释

代码 

运行截图 

 2.unshift()向数组的头部添加数组

解释

代码 

运行截图 

 3.pop()数组的尾部删除一个元素

解释

代码 

运行截图 

 4.shift()数组的头部删除一个元素

解释

代码 

运行截图 

5. splice()任意位置指定删除

解释

代码 

运行截图 

 二.数组的提取类

1. indexOf()指定查找索引

解释

    特点:

代码 

运行截图 

 2.lastIndexOf()向前查找

解释

代码 

 运行截图

3.案例:查找数组1元素的索引存储到数组2中 

代码

运行截图 

4.数组去重(重点)

 代码

运行截图

 三.数组的截取 

 1.slice()

解释

    特点:

代码 

运行截图

四.数组的操作方法 

1.concat()数组合并

解释

代码 

运行截图

2.   join()数组转化为字符串

 解释

 代码

运行截图

3.split()把字符串切割成数组 

4.reverse()翻转数组 


一.数组的增删方法

1.push()数组末尾添加元素

解释

push()

    参数是一个或者任意多个

    向数组末尾添加元素

    返回值是 新数组的长度

代码 

let arr1 = ['韩愈','柳宗元','王安石','苏轼']let arr2=arr1.push('苏辙','苏洵')console.log(arr1);console.log(arr2);  //6arr1.push('欧阳修','曾巩')console.log(arr1);

运行截图 

 2.unshift()向数组的头部添加数组

解释

向数组的头部添加数组

   unshift()

   参数1个 或者任意多个

   向数组头部添加元素

   返回值是 新的数组长度,ie6 7下面,没有返回值

代码 

 let arr3 = ['混蛋','傻蛋']arr3.unshift('笨蛋','蠢蛋')console.log(arr3);

运行截图 

 

 3.pop()数组的尾部删除一个元素

解释

 arr4.pop()

   从数组的尾部删除一个元素,每次只删除一个

   没有参数

   返回值是被删除的元素

代码 

 let arr4 = ['混蛋','傻蛋','笨蛋','蠢蛋']console.log(arr4);arr4.pop()console.log(arr4);let str = arr4.pop()  //pop()方法的返回值是 删除的那个元素console.log(arr4 , str)

运行截图 

 

 4.shift()数组的头部删除一个元素

解释

shift()

从数组的头部删除一个元素,每次只删除一个

没有参数

返回值是被删除的元素

代码 

 let arr4 = ['混蛋','傻蛋','笨蛋','蠢蛋']console.log(arr4);arr4.pop()console.log(arr4);let str = arr4.pop()  //pop()方法的返回值是 删除的那个元素console.log(arr4 , str)

运行截图 

5. splice()任意位置指定删除

解释

 .splice()

   从数组的任意位置开始,对指定长度的内容进行删除,替换工作

   可以插入任意数据类型的元素

   参数1:表现删除或者替换的起始位置

   产生。设置操作数据的长度,包含起始位置

   参数3:替换的新元素,也可以不写该参数

   参数2如果不写的话,则表示从1开始,一直到数组的最后,全部删除

   返回值是删除的元素所组成的

代码 

 arr6.splice(1,2,'鹅')console.log(arr6)let arr7 =arr6.splice(2)console.log(arr6)console.log('返回值',arr7)

运行截图 

 

 二.数组的提取类

1. indexOf()指定查找索引

解释

 indexOf()方法

    返回值是 指定内容在数组中的下标

    参数有两个

    参数1:指定的元素内容

    参数2:指定开始查找的位置,如果没有第二个参数,默认为0

    特点:

    1.从指定的位置开始查找

    2.找不到返回-1

    3.第二个参数不能为负数

代码 

let arr1 = ['马','牛','羊','坤','狗','猪']
let n1 = arr1.indexOf('坤')console.log(n1)let n2 = arr1.indexOf('马')console.log(n2)let n3 = arr1.indexOf('鸡')console.log(n3)let n4 = arr1.indexOf('马',3)console.log(n4)let arr2 = [1,2,3,1,3,4,5,3]let n5 = arr2.indexOf(3,3)console.log(n5);

运行截图 

 

 2.lastIndexOf()向前查找

解释

 lastIndexOf()

//      用法和indexOf()一样,只不过是从指定位置向前查找

代码 

    let arr5 = ['马','牛','羊','坤','狗','猪','羊']let n6 = arr5.indexOf('羊')console.log(n6);let n7 = arr5.lastIndexOf('羊')console.log(n7);if (n6==n7) {console.log('只有一只羊')}else{console.log('不仅仅只有一只羊');}

 运行截图

3.案例:查找数组1元素的索引存储到数组2中 

代码

let arr2 = [1,2,3,1,3,4,5,3]//在循环外部建一个空数组let arr3Index = []for (let i = 0; arr2.indexOf(3,i)!=-1;) {let n = arr2.indexOf(3,i)console.log(n);arr3Index.push(n)i = n+1  }console.log(arr3Index);

运行截图 

4.数组去重(重点)

 代码

 // 数组去重( 数组去掉重复项 )let arr3 = [1,2,3,4,4,4,3,2,1]let arr4 = []for (let i = 0; i < arr3.length; i++) {//如果arr4中不存在当前 循环的元素if (arr4.indexOf(arr3[i])==-1) {//把不存在的元素添加到arr4中arr4.push(arr3[i])}
}console.log(arr4);

运行截图

 三.数组的截取 

 1.slice()

解释

 数组的截取

    slice()

    参数1:开始截取的下标位置

    参数2:结束截取的下标位置

    截取的结果包含开始位置,不包含结束位置

    如果参数为负整数,则表示从后面开始往前计算,从-1开始计算

    特点:

    1.截取的时候,必须保证开始的位置在结束位置之前,否则截取为空数组

    2.参数必须是正整数,负整数或者0,其他非法字符都会被解析为0

    3.如果不写结束位置,则直接截取到最后

    4.如果没有参数,则会把整个数组截取,可以理解为复制数组。

代码 

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>数组的截取</title>
</head>
<body></body>
</html>
<script>/*数组的截取slice()参数1:开始截取的下标位置参数2:结束截取的下标位置截取的结果包含开始位置,不包含结束位置如果参数为负整数,则表示从后面开始往前计算,从-1开始计算特点:1.截取的时候,必须保证开始的位置在结束位置之前,否则截取为空数组2.参数必须是正整数,负整数或者0,其他非法字符都会被解析为03.如果不写结束位置,则直接截取到最后4.如果没有参数,则会把整个数组截取,可以理解为复制数组。*/let arr1 = [1,2,3,false,3>4,'葫芦娃','黑猫警长']let arr2 = arr1.slice(2,5)console.log(arr1);console.log(arr2);let arr3 = arr1.slice(-4,-2)console.log(arr3);//如果不写结束位置,则直接截取到最后let arr4 = ['葫芦娃','黑猫警长','虹猫蓝兔七侠转','猪猪侠','汪汪队']let arr5 = arr4.slice(2)console.log(arr5);//没有参数,复制一个数组let arr6 = arr4.slice()console.log(arr6);arr6[4] = '灌篮高手'console.log('灌篮高手',arr4);// arr7改动了arr4也会动let arr7 = arr4 arr7[4]='花园宝宝'console.log(arr7);console.log(arr4);
</script>

运行截图

四.数组的操作方法 

1.concat()数组合并

解释

 数组合并

    concat()

    参数是要合并的数组,可以是多个,使用逗号隔开

    返回值是一个合并后的数组

代码 

 let arr1 = ['妇好','花木兰']let arr2 = ['貂蝉','安其拉']let arr3 = ['钟无艳','姬小满']//合并数组let arr4 = arr1.concat(arr2,arr3)console.log(arr4);//也可以合并字符串let arr5 = arr4.concat(['伽罗'])console.log(arr5);

运行截图

2.   join()数组转化为字符串

 解释

数组转化为字符串

join()

参数只有一个,设置拼接的字符,默认是英文逗号,也可以设置其他符号

 代码

数组转化为字符串join()参数只有一个,设置拼接的字符,默认是英文逗号,也可以设置其他符号*/let str1=arr5.join('$') //使用$把数组元素拼接成一个字符串console.log(str1)

运行截图

3.split()把字符串切割成数组 

  //把字符串切割成数组,参数是切割符  (字符串方法)//妇好$花木兰$貂蝉$安其拉$钟无艳$姬小满$伽罗let arr6 = str1.split('钟无艳')console.log(arr6);

4.reverse()翻转数组 

  let arr7 = ['信阳','焦作','安阳','开封','巩义']let arr8 = []for (let i = arr7.length; i >=0; i--) {arr8.push(arr7[i])}console.log(arr8)/*直接翻转数组 使用reverse()修改数组的本身*/arr7.reverse()console.log(arr7);let n = '崔新芳'//每个字符之间是空字符//切割成数组let arr9 =n.split('')//翻转数组arr9.reverse()//拼接成字符串let as= arr9.join('')console.log(as)

 

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

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

相关文章

Android-网络访问技术Retrofit浅析

Retrofit是一种基于注解的网络请求库&#xff0c;专门用于在Android应用中进行网络访问。它使用简洁的方式定义了网络请求的接口&#xff0c;并自动将请求结果解析为Java对象。Retrofit的核心原理是利用了Java的动态代理技术&#xff0c;将网络请求接口的注解信息转化为具体的网…

如何配置Apple推送证书 push证书

如何配置Apple推送证书 push证书 转载&#xff1a;如何配置Apple推送证书 push证书 想要制作push证书&#xff0c;就需要使用快捷工具appuploader工具制 作证书&#xff0c;然后使用Apple的推送功能配置push证书&#xff0c;就可以得到了。PS&#xff1a;push没有描述文件&a…

如何借助数字化为企业管理赋能?

数字化可以利用技术简化流程、增强决策并提高整体效率&#xff0c;从而显着增强企业管理能力。以下是有关如何使用数字化赋能企业管理的分步指南&#xff1a; 1.评估当前流程和需求&#xff1a; 了解您当前的业务流程、痛点以及可以从数字化中受益的领域。确定您想要解决的具体…

Android Studio Giraffe控制台乱码

这几天在使用Android Studio Giraffe进行一个App的开发&#xff0c;在项目构建的时候&#xff0c;控制台输出中文都是乱码&#xff0c;看着很不爽&#xff0c;进行了两项配置&#xff0c;中文就可以正常输出了&#xff0c;看起来就爽多了。 第一个配置&#xff1a;点击Help菜单…

Datawhale Django入门组队学习Task02

Task02 首先启动虚拟环境&#xff08;复习一下之前的&#xff09; 先退出conda的&#xff0c; conda deactivate然后cd到我的venv下面 &#xff0c;然后cd 到 scripts&#xff0c;再 activate &#xff08;powershell里面&#xff09; 创建admin管理员 首先cd到项目路径下&a…

用于弥散加权MRI的关节各向异性维纳滤光片研究(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…

无涯教程-Perl - symlink函数

描述 此函数在OLDFILE和NEWFILE之间创建符号链接。在不支持符号链接的系统上,会导致致命错误。 语法 以下是此函数的简单语法- symlink ( OLDFILE, NEWFILE )返回值 如果失败,此函数返回0,如果成功,则返回1。 例 以下是显示其基本用法的示例代码,首先在/tmp目录中创建一…

亿赛通电子文档安全管理系统任意文件上传漏洞复现

0x01 产品简介 亿赛通电子文档安全管理系统&#xff08;简称&#xff1a;CDG&#xff09;是一款电子文档安全加密软件&#xff0c;该系统利用驱动层透明加密技术&#xff0c;通过对电子文档的加密保护&#xff0c;防止内部员工泄密和外部人员非法窃取企业核心重要数据资产&…

系统架构设计师-信息安全技术(1)

目录 一、信息安全基础 1、信息安全五要素 2、网络安全漏洞 3、网络安全威胁 4、安全措施的目标 二、信息加解密技术 1、对称加密 2、非对称加密 3、加密算法对比 三、密钥管理技术 1、数字证书 2、PKI公钥体系 四、访问控制技术 1、访问控制基本模型 2、访问控制的实现技术…

近 2000 台 Citrix NetScaler 服务器遭到破坏

Bleeping Computer 网站披露在某次大规模网络攻击活动中&#xff0c;一名攻击者利用被追踪为 CVE-2023-3519 的高危远程代码执行漏洞&#xff0c;入侵了近 2000 台 Citrix NetScaler 服务器。 研究人员表示在管理员安装漏洞补丁之前已经有 1200 多台服务器被设置了后门&#x…

flutter 常见的状态管理器

flutter 常见的状态管理器 前言一、Provider二、Bloc三、Redux四、GetX总结 前言 当我们构建复杂的移动应用时&#xff0c;有效的状态管理是至关重要的&#xff0c;因为应用的不同部分可能需要共享数据、相应用户交互并保持一致的状态。Flutter 中有多种状态管理解决方案&#…

Web和云开发,Rust会起飞?

Web和云开发&#xff0c;Rust会起飞&#xff1f; 一、前言 二、大厂偏爱&#xff0c;Rust的未来 三、Rust做Web的雄心 四、有必要换Rust做Web&#xff1f; 1.效率和性能 2.可靠性和可维护性 五、Rust先苦后甜 六、用Rust前的几个问题 七、开发界的强者 一、前言 去年…

Leetcode-每日一题【剑指 Offer 32 - II. 从上到下打印二叉树 II】

题目 从上到下按层打印二叉树&#xff0c;同一层的节点按从左到右的顺序打印&#xff0c;每一层打印到一行。 例如: 给定二叉树: [3,9,20,null,null,15,7], 3 / \ 9 20 / \ 15 7 返回其层次遍历结果&#xff1a; [ [3], [9,20], [15,7] ] 提示&#xff…

《安富莱嵌入式周报》第320期:键盘敲击声解码, 军工级boot设计,开源CNC运动控制器,C语言设计笔记,开源GPS车辆跟踪器,一键生成RTOS任务链表

周报汇总地址&#xff1a;嵌入式周报 - uCOS & uCGUI & emWin & embOS & TouchGFX & ThreadX - 硬汉嵌入式论坛 - Powered by Discuz! 视频版&#xff1a; https://www.bilibili.com/video/BV1Cr4y1d7Mp/ 《安富莱嵌入式周报》第320期&#xff1a;键盘敲击…

炫酷UI前端效果的CSS生成工具

提升设计人员和前端开发人员的工作 推荐炫酷UI前端效果的CSS生成工具1.Neumorphism2.带有渐变的图标3.Interactions4.大型数据库5.动画6.Mask7.动画按钮8. 自定义形状分隔线9.背景图案10. SVG波浪推荐炫酷UI前端效果的CSS生成工具 1.Neumorphism 地址:https://neumorphism.i…

linux动态链接之.plt与.got.plt

1. 动态链接 一个 main.c 文件 #include <stdio.h> #include <stdlib.h>int main() {puts("123");puts("456");return 0; }此时我们编译它默认会使用动态链接默认生成a.out可执行文件 gcc main.c当第一次调用puts函数时&#xff0c;会去往.…

系统学习Linux-Mariadb高可用MHA

概念 MHA&#xff08;MasterHigh Availability&#xff09;是一套优秀的MySQL高可用环境下故障切换和主从复制的软件。 MHA 的出现就是解决MySQL 单点的问题。 MySQL故障切换过程中&#xff0c;MHA能做到0-30秒内自动完成故障切换操作。 MHA能在故障切换的过程中最大程度上…

【Go】Go 文本匹配 - 正则表达式

正则表达式&#xff08;Regular Expression, 缩写常用regex, regexp表示&#xff09;是计算机科学中的一个概念&#xff0c;很多高级语言都支持正则表达式。 目录 何为正则表达式 语法规则 普通字符 字符转义 何为正则表达式 正则表达式是根据一定规则构建而出的规则&…

AI 绘画Stable Diffusion 研究(九)sd图生图功能详解-老照片高清修复放大

大家好&#xff0c;我是风雨无阻。 通过前面几篇文章的介绍&#xff0c;相信各位小伙伴&#xff0c;对 Stable Diffusion 这款强大的AI 绘图系统有了全新的认知。我们见识到了借助 Stable Diffusion的文生图功能&#xff0c;利用简单的几个单词&#xff0c;就可以生成完美的图片…

小程序体验版不存在 无法体验

1、权限问题&#xff1a; 1、开发者有所有权限。 2、小程序访问路径也是正确的。 该有的权限都有了。 2、解决办法&#xff1a; 打开微信公众平台&#xff0c;左侧菜单【设置】- 【第三方设置】&#xff0c;取消授权即可。