JavaScript ,16种常用数组方法

news2024/11/22 19:12:26

前言

📗众所周知,向后端请求数据,处理数据是前端工程师必备的技能,从后端请求回来的数据往往是数组的形式返回到前端,因此数组处理方法的重要性可想而知;每次在处理对应数据都需要查阅一下因此记录一下使用方法

💡不会改变原数组的方法

forEach()方法

⛳️ forEach()方法传入的参数是一个函数,内部传入的函数的形参第一个是item数组每一项的值,第二个是索引号index,它的返回值是undefined;
运行实例如下:

filter()方法

⛳️ filter()方法是筛选数组的方法,传入的参数和forEach方法一样,但是返回值为一个数组,实际应用是用来将获取到的数据中符合条件的数组筛选出来;
运行的实例如下:

map()方法

⛳️ map()方法传入的参数也同上,它的返回值也是一个新的数组;map()方法可以对数组的每一项进行相同的处理

运行的实例如下:

findIndex()方法

⛳️ findIndex()方法顾名思义,是返回数组中的符合条件的第一项的索引号,如果找不到返回-1。传入的参数同上

运行实例如下所示:

find()方法

⛳️ find()方法是返回查找到的第一个符合条件的那一项,传入的参数同上。

运行实例如下所示:

经常与filter方法搭配着使用

some()方法

⛳️ some()方法传入的参数同上,返回值是布尔值,只要查找到一项符合条件就返回true;

示例如下:

every()方法

⛳️ every()方法传入的参数也是同上,返回值是布尔值,但是必须每一项都符合条件才返回true;

示例如下:

reduce()归纳函数

⛳️ reduce()函数中

  1. recude函数接收两个参数,一个为回调函数,一个为初始赋值
  2. 第一个参数的回调函数又接收四个参数,分别为(初始值或计算结束后的返回值,当前元素,当前元素的索引,当前元素所属的数组对象)
  3. 第二个参数是传给函数的初始值,非必传

代码示例如下:

初始值是0,0可以不写

初始值是1

计算数组中每个元素出现的次数

concat()数组拼接

⛳️concat()将两个数组进行拼接,返回的是拼接完的新数组,不能给多维数组(数组套数组)进行拼接;
代码示例如下:

💡改变原数组的方法

push()方法

⛳️是在数组的最后面添加一个元素,返回值是新数组的长度;

代码示例如下:

unshift()方法

⛳️是在数组的最前面添加一个元素,返回值是新数组的长度;

代码示例如下:

pop()方法

⛳️删除数组的最后一个值;返回值是删除的那一项;

代码示例如下:

shift()方法

⛳️删除数组的第一项的值;返回值是删除的那一项;

代码示例如下:

sort()方法

⛳️sort()方法是排序,内部的参数是一个函数,function(a , b){ return a - b },通过此函数可以控制排序是降序函数升序,如果参数内部return a - b是升序,return b-a是降序;

代码示例如下:

纯数字升序

数字加字符串升序

纯数字降序

数字加字符串降序

按照对象指定的属性值进行升序或降序排列

reverse()方法

⛳️reverse()是数组翻转,即将数组的元素倒序排列;

代码示例如下:

splice()方法

⛳️splice()方法修改原数组,返回一个删除元素的新数组,负数就是从后往前数索引;传入的第一个参数是删除的起始元素的索引号,第二个参数是删除的元素的个数;

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

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

相关文章

MVVM框架代码逻辑整合

文章目录 逻辑总结为什么要将业务和视图分开为了解耦数据不同数据层数据冗余视图层非业务数据业务数据再处理 保证各层数据的封闭性 逻辑总结 将前端分为视图层,中间层,业务层。 视图层负责页面渲染业务层负责数据处理中间层负责业务层和视图层的关系 …

Mariadb读写分离

zzhttps://mp.csdn.net/mp_blog/creation/editor/131087599https://mp.csdn.net/mp_blog/creation/editor/131087599准本环境 systemctl stop firewalld setenforce 0 #关闭防火墙 iptables -F 192.168.1.2 #主库服务器 192.168.1.3 #从库服…

【Flutter】Flutter 使用 json_serializable 进行 JSON 序列化

文章目录 一、前言二、 json_serializable 简介三、如何在 Flutter 中安装和配置 json_serializable四、json_serializable 的基本使用五、一个实际的 Flutter 应用示例六、版本信息七、总结 一、前言 嗯啊,你好呀!欢迎来到我的博客。 今天我们要聊聊的…

基于安卓的初中英语语法APP设计与实现(源码+文档+PPT)

智能手机的普及使移动学习成为一种全新的学习方式,越来越受到研究者与学习者的关注。调查显示,移动学习对英语学习特别是应用英语的学习有良好的效果。基于Android设计开发的英语语法APP包含“练习题册”、“语法分析”、“搜索语法”三大功能模块,能够帮助学生利用碎片时间学习…

HBase(11):shell管理操作

1 status 例如:显示服务器状态 2 whoami 显示HBase当前用户,例如: 3 list 显示当前所有的表 4 count 统计指定表的记录数,例如: 5 describe 展示表结构信息 6 exists 检查表是否存在,适用于表量特别多的情况

nginxWebUI 远程命令执行漏洞

漏洞介绍 nginxWebUI是一款图形化管理nginx配置的工具,能通过网页快速配置nginx的各种功能,包括HTTP和TCP协议转发、反向代理、负载均衡、静态HTML服务器以及SSL证书的自动申请、续签和配置,配置完成后可以一键生成nginx.conf文件&#xff0c…

Adobe中修改注释签名

控制面板-> 系统和安全-> 管理工具-> 计算机管理-> 打开“计算机管理”对话框-> 在左边栏的系统工具下选择本地用户和组-> 点击“用户”->选择要改的用户名->右键重命名 打开Adobe Acrobat->点击"编辑"->首选项->注释 ->把 “登…

vue实现复制文本格式化

vue全局方法 实现复制文本格式化,方法简单实用易懂,100%成功 先上效果图 实现步骤 第一步 ,在main.js 插入以下代码 Vue.prototype.copys = function copys(text) {var isRTL = document.documentElement.getAttribute(dir) === rtl;var element = document.createElemen…

【半监督图像分割 2022 CVPR】UCC

文章目录 【半监督图像分割 2022 CVPR】UCC摘要1. 简介2. 相关工作2.1 半监督分类2.2 半监督语义分割。 3. 交叉头协同训练的半监督学习3.1 整体预览3.2 弱增强和强增强3.3 动态交叉集复制粘贴策略3.4 不确定度估计 4. 实验4.1 实验设置4.2 对比sota4.3 消融实验 5. 总结 【半监…

《移动互联网技术》第六章 资源管理: 掌握定制控件样式、界面主题、可绘制资源程序的编写方法

🌷🍁 博主 libin9iOak带您 Go to New World.✨🍁 🦄 个人主页——libin9iOak的博客🎐 🐳 《面试题大全》 文章图文并茂🦕生动形象🦖简单易学!欢迎大家来踩踩~&#x1f33…

Linux下的分布式迁移工具dsync使用

一、Linux下的分布式迁移工具dsync使用 dsync 是一个在 Linux 系统上用于迁移文件和目录的工具。它可以在不同的存储设备之间进行数据同步和迁移操作。dsync 是 rsync 工具的一个衍生版本,专注于在本地文件系统之间进行数据迁移。 这里是官网:dsync 1、…

【强化学习】常用算法之一 “DQN”

作者主页:爱笑的男孩。的博客_CSDN博客-深度学习,活动,python领域博主爱笑的男孩。擅长深度学习,活动,python,等方面的知识,爱笑的男孩。关注算法,python,计算机视觉,图像处理,深度学习,pytorch,神经网络,opencv领域.https://blog.csdn.net/Code_and516?typeblog个…

5、多层感知机:过拟合解决方法:权重衰退、丢弃法

1、权重衰退 1. 基础概念 实际上,限制特征的数量是缓解过拟合的一种常用技术。然而,简单地丢弃特征对这项工作来说可能过于生硬。我们继续思考多项式回归的例子,考虑高维输入可能发生的情况。多项式对多变量数据的自然扩展称为单项式&#…

微信小程序学习记录3 案例分享<蓝牙小车UI>

效果 页面1 一键连接蓝牙 页面2 控制页面 思路 页面1 旋转动画一键连接蓝牙(写死了device id和uuid) 页面2 轮播图按键 按键绑定不同事件即可

多模态大语言模型综述来啦!一文带你理清多模态关键技术

夕小瑶科技说 原创 作者 | 智商掉了一地、Python 随着 ChatGPT 在各领域展现出非凡能力,多模态大型语言模型(MLLM)近来也成为了研究的热点,它利用强大的大型语言模型(LLM)作为“大脑”,可以执…

Linux卸载OpenJDK

1、JDK版本 java -version2、查看当前系统OPENJDK rpm -qa | grep jdk3、卸载 sudo rpm -e --nodeps java-1.8.0-openjdk sudo rpm -e --nodeps java-1.8.0-openjdk-headless sudo rpm -e --nodeps java-1.8.0-openjdk-devel sudo rpm -e --nodeps copy-jdk-configs4、其他 …

爬虫入门指南(3):Python网络请求及常见反爬虫策略应对方法

文章目录 引言HTTP协议与请求方法HTTP协议请求方法 使用Python进行网络请求安装Requests库发送GET请求发送POST请求 反爬虫与应对策略IP限制使用代理IP: 用户代理检测设置User-Agent头部: 验证码参考方案 动态页面请求频率限制未完待续.... 引言 在当今…

Python 基本数据类型(五)

文章目录 每日一句正能量List(列表)结语 每日一句正能量 营造良好的工作和学习氛围,时刻牢记宗旨,坚定信念,胸怀全局,埋头苦干,对同事尊重信任谅解,发扬团体协作精神,积极…

安装tomcat的步骤与部署服务详解

目录 一安装tomcat步骤 1.首先关闭防火墙跟安全机制 2.安装jdk把jdk包与tomcat的包下载到/opt目录 3.然后用命令查看安装好的版本号 4.安装好jdk后需要把他设置到环境变量中去以免系统找不到 5.下来装tomcat 6.首先把你的tomcat安装包解压 然后包名太长简写成tomcat 7.进…

【单片机】STM32单片机频率计程序,外部脉冲计数程序,基于脉冲计数的频率计程序,STM32F103

文章目录 定时器外部脉冲计数功能程序实现TIM1 定时一秒钟中断TIM2 外部脉冲计数配置TIM3 PWM产生总程序 定时器外部脉冲计数功能 两种方法用于在单片机中实现频率计的功能。 第一种方法是通过定时器来衡量信号的周期,然后将周期转换为频率。在这种方法中&#xf…