【前端】数组的常用处理函数

前言

item------->每个元素值 (必)
index----->索引(可选)
arr-------- >当前数组(可选)
推荐vscode的一款插件来写以下的demo,该插件可以直接在js文件中显示结果,搜 Quokka.js
用这个插件去新建一个js文件,直接就运行在node上了

代码

const aa=[1,2,3,4,5,6]
const a=aa.forEach((item,index,arr)=>{
  console.log(item,index,arr);
   arr[index]=2*item;
})
aa.map(v=>v*2)
console.log(aa);
//forEach方法不会返回一个新的数组,而是返回undefined,不适合需要中止或跳出循环的情况。


const bb=[1,2,3,4,5,6]
const b=bb.map((item,index,arr)=>{
  console.log(item);
  return 2*item;
})
bb.map(v=>v*2)
console.log(bb);
//map方法会返回一个新的数组,适合需要返回一个新数组的情况。遍历中没值返回undefined


const cc=[1,2,3,4,5,6]
const c=cc.every(v=>{ 
  console.log(v);
  return v>2}
 )
console.log(c);
//every方法会返回一个布尔值,表示数组中所有元素是否都满足条件。

const dd=[1,2,3,4,5,6]
const d=dd.some(v=>{
  console.log(v);
  return v>2
})
console.log(d);
//some方法会返回一个布尔值,表示数组中是否存在满足条件的元素。


const ee=[1,2,3,4,5,6]
const e=ee.find(v=>v>3)
console.log(e);
//find方法会返回数组中第一个满足条件的元素。否则返回undefined。findIndex返回索引没找到返回-1


const ff=[1,2,3,4,5,6]
const f=ff.filter(v=>v>3)
console.log(f);
//filter方法会返回一个新的数组,包含所有满足条件的元素。

const gg=[1,2,3,4,5,6]
const initValue=0
const g=gg.reduce((accumulator,currentValue,index,arr)=>{
  console.log(accumulator,currentValue,);
  return accumulator+currentValue;
},initValue)
console.log(g);
//reduce方法会返回一个值,这个值是通过将数组中的每个值(从左到右)开始reducer函数应用于初始值(或前一个结果)而计算得出的。
//前2个参数是必须的,第一个参数为累加值,是上次返回的结果,第二个参数为当前元素。
//initValue是可选的,表示传递给函数的初始值。如果没有提供,则将使用数组的第一个元素。

总结

forEach不会返回一个新的数组,里面改值会影响原数组,其他方法不影响原数组
map可以返回新数组 用于映射,如每个元素都加倍或执行其他转换操作
every返回一布尔值,需数组中全部满足
some只要满足一个
find返回第一个满足的元素值
filter过滤返回新数组,如筛选出所有偶数或满足其他条件的元素
reduce用于计算

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

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

相关文章

埋点,自己写插件,自己写的按钮埋点,掘金同款投递简历

20分钟掌握 Vite 插件开发 - 掘金 vite的生命周期啥的 1.浏览器的控制台输出有样式的字 // const randomLetterPlugin ()>{ // const letters [wwwwwww,000000000000,888888888888]; // //随机获取一个字符并打印 // const printRandomLetter ()>{ // …

如何更好的管理个人财务?使用极空间部署私有记账系统Firefly III

如何更好的管理个人财务?使用极空间部署私有记账系统Firefly III 哈喽小伙伴们好,我是Stark-C~ 不知道屏幕前的各位“富哥”日常生活中是怎么管理自己巨额财富的,反正对于像我这样年薪过千的摸鱼族来说,请一个专业的理财顾问多多…

电子签名在人力资源中的应用:让HR工作更高效

人力资源(HR)行业是电子签领域的重要应用之一,它可以在以下场景中使用电子签: 1. 在招聘流程中,HR部门可以利用电子签名工具来完成与招聘候选人之间的任何文件签署操作。例如,维护人才库数据库、简历、面试…

世界读书日 | 开发者必读书单重磅来袭,华为云DTSE专家天团力荐

春色恰如许,读书正当时。 读书,就像解锁一把神秘钥匙,为开发者洞开新世界的大门,赋予他们破译复杂难题的能力、挑战未知领域的勇气。书页翻动间,开发者得以站在巨人的肩膀上,汲取前人经验,积蓄…

RANSAC 配准算法

RANSAC 配准算法 1. 简介2. RANSAC步骤3. RANSAC原理4. RANSAC的优缺点5. 代码实现6. 参考 1. 简介 先讲一下背景吧。 点云配准(Point Cloud Registration)指的是输入两幅点云 (source 和 target) ,输出一个变换使得变换后的source和target…

管理 Python 项目的艺术:在 PyCharm 中使用虚拟环境(以BPnP为例)

在 PyCharm 中使用虚拟环境对于 Python 项目开发具有多方面的重要作用,这些作用体现在提升项目管理的效率、保障代码的可运行性以及维护项目的长期稳定性等方面。以下是使用虚拟环境的几个关键好处: 1. 依赖管理和隔离 虚拟环境允许每个项目拥有…

深度相机(3D相机)

传统的RGB彩色相机称为2D相机, 只能得到2D的图像信息, 无法得到物体与相机的距离信息,也就是深度信息。 顾名思义, 深度相机除了获取2D信息,还能得到深度信息,也叫RGBD相机, 或3D相机。 顺便提…

CSS介绍及三种应用方式[内联,内嵌,外链]元素及实例讲解

css介绍 CSS(Cascading Style Sheets)是一种用于描述HTML文档外观和格式的样式表语言。CSS允许开发者和设计师将网页的呈现(布局、颜色、字体等)与内容(HTML)分离开来,从而使得网页的设计更加灵…

vue2+vxe-table实现表格增删改查+虚拟滚动

vue2vxe-table实现表格增删改查虚拟滚动 使用的vxe-table版本&#xff1a;v3.x (vue 2.6 长期维护版) 完整代码 <template><div><vxe-toolbar ref"xToolbar" export :refresh"{query: findList}"><template #buttons><vxe-b…

vulhub weblogic全系列靶场

目录 简介 需要使用的工具 CVE-2017-10271 0x00 漏洞产生原因 0x01 影响范围 0x02 漏洞地址 0x03 环境 0x04 漏洞复现 1. 手工 2. 漏洞利用工具 CVE-2018-2628 0x00 漏洞产生原因 0x01 影响范围 0x02 环境 0x03 漏洞复现 1.nmap扫是否是T3协议 2.漏洞检测&…

【C++】详解初始化列表,隐式类型转化,类静态成员,友元

前言 初始化列表是对构造函数内容的补充&#xff0c;小编会详细的讲解初始化列表的概念&#xff0c;特性&#xff0c;注意点。这是本篇内容的重头戏&#xff0c;小编会先提一个问题来抛砖引玉。 隐式类型转换顾名思义&#xff0c;首先它不需要主动转换&#xff0c;类似于把浮点…

抖音运营全攻略 沈阳新媒体运营培训

抖音发展趋势 数据显示&#xff0c;2023年&#xff0c;抖音日活量突破10亿。是目前最火的短视频软件。 抖音的总用户数量已超过12亿&#xff0c;日活10亿&#xff0c;人均单日使用时长超过2小时&#xff0c;这只是平均数据&#xff0c;其实大部分人刷抖音时间会超过3个小时&am…

Hive数据类型

1.基本数据类型 示例&#xff1a; -- 创建表并定义列的数据类型 CREATE TABLE data_types_example (tinyint_column TINYINT,smallint_column SMALLINT,int_column INT,bigint_column BIGINT,boolean_column BOOLEAN,float_column FLOAT,double_column DOUBLE,string_column S…

HSB矩形调色板设计和计算方法

HSB矩形调色板设计和计算方法 RGB调色板绘制较容易&#xff0c;HSB调色板较难绘制&#xff0c;前些天发文介绍了几个矩形样例的绘制方法&#xff0c;今介绍矩形的HSB调色板的设计方法和H,S,B值的计算方法&#xff0c;好东西必须与大家分享。 此文介绍HSB调色板和选色条的绘制方…

jdbc操作数据库 and 一个商品管理页面

文章目录 1. 介绍1.1 应用知识介绍1.2 项目介绍 2. 文件目录2.1 目录2.2 介绍以下&#xff08;从上到下&#xff09; 3. 相关代码3.1 DBConnection.java3.2 MysqlUtil.java3.3 AddServlet.java3.4 CommodityServlet.java3.5 DelectServlet.java3.6 SelectByIdServlet.java3.7 S…

Springboot 结合PDF上传到OSS

目录 一、首先注册阿里云OSS&#xff08;新用户免费使用3个月&#xff09; 二、步骤 2.1 将pdf模板上传到oos 2.2 这里有pdf地址,将读写权限设置为共工读 ​编辑 三、代码 3.1 pom.xml 3.2 配置文件 3.3 oss model 3.4 配置类(不需要修改) 3.5 将配置类放入ioc容器 3.…

【C++】:构造函数和析构函数

目录 前言一&#xff0c;构造函数**1.1 什么是构造函数****1.2 构造函数的特性**1.3 总结 二&#xff0c;析构函数**2.1 什么是析构函数****2.2 析构函数的特性****2.3 总结** 前言 如果一个类中什么成员都没有&#xff0c;简称为空类。 空类中真的什么都没有吗&#xff1f;并…

JetBrains PhpStorm v2024.1 安装教程 (PHP集成开发IDE)

前言 PhpStorm是由JetBrains推出的一款轻量级集成开发环境&#xff0c;专为PHP开发者而设计。该软件融合了智能的HTML/CSS/JavaScript/PHP编辑器、代码质量分析工具、版本控制系统集成&#xff08;包括SVN和GIT&#xff09;、调试和测试等功能。除此之外&#xff0c;PhpStorm还…

画图的神器及必备的调色和选图工具

大学生研究生论文写作及画图的神器 前言常用的工具集合画图工具配色参考画图神器词云 最后下篇 前言 好久没有更博&#xff0c;来更一下吧。最近刚好被问到平常是用什么来画图的&#xff0c;包括会议论文&#xff0c;各种类型的PPT汇报以及项目报告等等里面的图怎么画好。所以…

CSS动画(css、js动画库:各种动画效果)

第一种方法&#xff1a;文字从上到下显示动画&#xff1b; <div class"text-container"><div class"text">文字从上到下显示</div></div><style scoped> /*确保 keyframes 规则在引用它的任何选择器之前定义&#xff0c;以避…
最新文章