数组的高级用法:Array.filter(),Array.forEach(),Array.find(),Array.reduce()

数组操作方法(包括es6数组的操作方法) //(1)push() //向数组最里面推一个或多个数据 var arr=["色","等","烟","雨"]; arr.push("而",'我',"在"); console.log(arr); //(2)unshift() // 在数组的开头添加一个或多个数据 var arr=["色","等... 阅读详情
state:{
  cart:[
         {
            goods_count: 1
            goods_id: 1
            goods_name: "vivo"
            goods_price: 2449
            goods_small_logo: "https://m.360buyimg.com/mobilecms/s750x750_jfs/t1/9
                        7145/27/38119/48989/64354c50F90b4d6bf/dcbf0f37dd534acf.jpg!q80.dpg"
            goods_state: true
         },
            goods_count: 1
            goods_id: 2
            goods_name: "vivo"
            goods_price: 2449
            goods_small_logo: "https://m.360buyimg.com/mobilecms/s750x750_jfs/t1/9
                        7145/27/38119/48989/64354c50F90b4d6bf/dcbf0f37dd534acf.jpg!q80.dpg"
            goods_state: true
         },
      ],
}

  goods_id: this.goods_info.goods_id,       // 商品的Id
         goods_name: this.goods_info.goods_name,   // 商品的名称
         goods_price: this.goods_info.goods_price, // 商品的价格
         goods_count: 1,                           // 商品的数量
         goods_small_logo: this.goods_info.goods_small_logo, // 商品的图片
         goods_state: true                         // 商品的勾选状态

 

1.Array.filter()

filter() 方法创建一个包含通过测试的数组元素的新数组。

运用案例:

说明: state.cart是个数组,goods_id是传递进来的参数,配合箭头函数使用   意思是cart数组里面的goods_id和传递进来的goods_id判断

// 根据id 删除对应的商品
        removeGoodsByid(state, goods_id) {
            // 把ID不相等的商品重新赋值给数组cart ,它们是不被删除的   filter数组过滤器
            state.cart = state.cart.filter(x => x.goods_id !== goods_id)
        },

2.Array.forEach()

forEach() 方法为每个数组元素调用一次函数(回调函数)。

运用案例:

说明:state.car是个数组,对它进行循环第一个参数state就是它本身,newState是传递进来的参数 ,对它进行循环,配合箭头函数,循环出来的goods_state值进行赋值newState

// 更新购物车中所有商品的勾选状态   实现全选的正选和反选
        updateAllGoodsState(state, newState) {
            state.cart.forEach(x => x.goods_state = newState)
        }

3.Array.find()

find() 方法返回通过测试函数的第一个数组元素的值。

运用案例:

说明:通过数组里商品的id和外界传过来的id  判断cart数组里 有没有该商品

    addToCart(state, goods) {
            // 通过数组里商品的id和外界传过来的id  判断cart数组里 有没有该商品
            const findResult = state.cart.find(x => x.goods_id === goods.goods_id)
            // 如果没有,就push进来
            if (!findResult) {
                state.cart.push(goods)
            } else {
                // 如果已经有就让数量自增+1
                findResult.goods_count++
            }

        },

4.Array.reduce()

reduce() 方法在每个数组元素上运行函数,以生成(减少它)单个值。

reduce() 方法在数组中从左到右工作。另请参阅 reduceRight()。

reduce() 方法不会减少原始数组。

有4个参数total, value, index, array

运用案例:

说明:计算数组里面goods_count数量的总和    后面可以放个初始值0

state.cart.reduce((total, item) => total += item.goods_count, 0)

Twincat Scopeview录波中的Ringbuffer设置技巧与常见问题解决 本文深入解析了倍福Twincat Scopeview录波功能中Ringbuffer(环形缓冲区)的核心设置技巧与常见问题解决方案。针对数据丢失、触发时机不准等痛点,详细阐述了缓冲区大小、预触发样本、采样率等关键参数的优化配置,并提供了多通道同步、自动诊断等实战应用指南,帮助工程师高效捕捉和分析PLC数据。 阅读详情

相关推荐

自托管AI邮件助手imap-mcp:安全连接Claude与个人邮箱的完整指南

在AI助手日益普及的今天,如何安全地让AI访问个人邮箱数据成为关键挑战。传统方法如直接暴露IMAP/SMTP凭证存在严重安全隐患,而第三方SaaS服务则涉及隐私泄露风险。Model Context Protocol (MCP) 作为一种新兴的标准化协议,为AI工具安全接入提供了解决方案。其核心价值在于实现数据源与AI助手间的安全、标准化交互,特别适用于处理敏感信息的场景。imap-mcp正是基于MCP协议构建的自托管邮件网关,它通过多层安全机制(包括主密钥加密和OAuth令牌哈希化)保护用户凭证,让用户能在

weixin_28295799的博客 655

Array-数组遍历循环的几种方法map|filter|some|every|forEach|find|findIndex|for

【代码】Array-数组遍历循环的几种方法map|filter|some|every|forEach|find|findIndex|for。

绝世唐门三哥的博客,多多关注,会不定期产出高质量文章和大家共享! 3709

技术美术个人笔记(十六)——Houdini到UE的大地形

文章目录关于地形白模制作关于PDG流程 关于地形白模制作 用heightfield noise和笔刷刷出合适的mask做山形叠加: 用remap可快捷反转mask ,用来做平原地区的小型丘陵: 接着用clip切平最低处,用distort制造侵蚀等,对部分地区用笔刷进行微调拓宽峡谷: 用经过sweep打平的曲线以及裁切的各种多面体用heightfield_project投影制作河道和水池,用blur mask并remap的方法拓宽河道 用distort、erode制造合适的弯曲和侵蚀,同理可挖出月牙形

小谁的博客 3180

js数组高阶函数——filter()方法

上面的例子中,我们筛选words数组中的每一项元素的长度大于6的元素,因为每一个元素都是个单词,是个字符串,字符串也有长度,所以这样也可以过滤出我们想要的。这个例子中,声明一个数组,并过滤,执行的逻辑是一个条件。条件为值大于等于10,也就是说,我们声明了一个数组,并且筛选了数组中每一项大于10的数字。上面这个例子,我们将数组中每一项id为1的筛选出来。后端有SQL语句可以查询,前端也可以通过这样的方式来实现查询,筛选。⭐一般来说,filter() 方法用于过滤数组中的元素,并返回一个新数组。

杜永康的博客 7万+

实战指南 | IC模拟版图设计从零到精通,手把手带你掌握EDA工具与GDSII输出

本文提供了一份从零开始的IC模拟版图设计实战指南。详细介绍了如何搭建Linux环境、安装Cadence Virtuoso等EDA工具,并深入解析了PDK设计规则。通过手把手绘制CMOS反相器版图的实例,系统讲解了版图绘制、DRC/LVS验证、寄生参数提取、匹配设计以及ESD防护等核心技能,最终指导如何正确生成交付芯片制造厂的标准GDSII文件,帮助读者掌握完整的模拟版图设计流程。

weixin_29214691的博客 390

无法找到来自源 nvlddmkm 的事件 ID 14 的描述

具体错误是: 无法找到来自源 nvlddmkm 的事件 ID 14 的描述。本地计算机上未安装引发此事件的组件,或者安装已损坏。可以安装或修复本地计算机上的组件。 出现这样错误的原因有很多了,有可能是硬件有可能是软件。由于我是刚配置的电脑,起初非常怀疑是自己组装的问题,折腾了好久,心态爆炸!!!先说我报这样错误的情况,以及解决办法,供后面人参考。 ...

SeventhBlue 6万+

Array高阶函数reduce&filter

① reduce()方法 1、语法 arr.reduce(callback,[initialValue]) 复制代码reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素,接受四个参数:初始值(或者上一次回调函数的返回值),当前元素值,当前索引,调用 reduce 的数组。 callback (执行数组中每个值的函数,包含四个参数) 1、previous...

weixin_34217711的博客 193

Unity简单操作:PostProcessing的使用

Postprocessing是一个unity2018版本的集成后期插件,有了这个插件,之后用unity开发时,后期调整颜色、光晕等会很方便。 目录 新建一个postprocessing profile(配置文件)。​ 参数说明: 新建一个postprocessing profile(配置文件)。 在主相机下加一个组件PostProcess Layer。 注意:需要将相机的Layer层设置与Post Process Layer 下的Volume blending(体积混合)...

weixin_39114763的博客 7369

mongodb修改list内的匹配元素java写法filterArray

由于公司用mongodb存储树状菜单,要对里面的子节点进行crud操作 数据结构如下 要对child内的数据进行新增修改 比如往categoryDocmentList.child.child 名称为 '二级分类s3331'的sign添加一个数组元素 Query query = new Query(); query.addCriteria(Criteria.where("_id").is("6132dd9b0bb4b1261b244932"));//查询指定的文档 Update upd..

qq_36850714的博客 1404

6、基于深度强化学习的无人机路径规划

本文研究了基于深度强化学习的无人机路径规划方法,提出了一种融合改进DQN算法与人工势场法的路径规划策略。通过设计合理的网络结构、状态空间、动作空间和奖励函数,结合ε-贪心策略进行动作选择,实现了无人机在复杂环境中的自主避障与目标导向飞行。仿真实验表明,该方法具有收敛速度快、实时性强和可操作性高等优点,能有效完成室内环境下的路径规划任务。文章还总结了算法优势,并对未来在连续动作、复杂环境适应及多无人机协同等方面的发展方向进行了展望。

web39explorer的博客 166

算法 | 植物根茎生长优化算法(PRGO)原理、公式及应用,matlab代码(2025最强优化算法)

【代码】算法 | 植物根茎生长优化算法(PRGO)原理、公式及应用,matlab代码(2025最强优化算法)

尘世冰封的专栏 1017

Array中的map(),filter()和reduce()

一、map() map用于遍历数组中每一项的值,进行一系列的操作。 const prices = [19.99, 4.95, 25, 3.50]; let new_prices = []; for(let i = 0; i < prices.length; i++) { new_prices.push(prices[i] * 1.06); } 用map来书写会简单许多: const prices= [19.99, 4.95, 25, 3.50]; let new_prices =

qq_40289624的博客 315

【异常】OpenAI提示内容有误 Invalid prompt: your prompt was flagged as potentially violating our usage policy.

用户需优先调整提示内容,确保符合OpenAI的使用政策。若问题持续,建议结合请求ID和具体代码示例联系官方支持。同时,可参考腾讯云、Microsoft Q&A等平台提供的错误处理实践(如重试机制、日志记录)优化代码健壮性。

奶爸的编程之路,也就一周冷个三天 2081

数组中常用的方法

push()方法用于向数组末尾添加一个或多个元素,并返回修改后的数组的新长度。pop() 方法用于删除并返回数组的最后一个元素。

zhu_liu_kun的博客 465

大中型超市收银系统(可直接运行)

光步前台收银系统系统功能:商品销售、商品退货、挂单、收银员权限、会员销售、单品取消、整单取消、商品查询、脱机销售、脱机数据上传,基本资料下载,开钱箱、小票打印、收款结算,支持多币种付款方式(现金、储值卡、礼券、微信等),支持多种促销。运行环境:.net 4.0登陆信息用户名:1001 密码:123456内置商品信息,商品编码可输入00001000 - 00010000,测试效果相关功能键F5 结算 F9挂单 F11商品查询 F8退货 Insert单品取消 Del整单取消 F12开钱箱F2 会员 Ctrl+Z退出系统 Home 锁屏 相关源码待公开

文档:亲测可用解决vnc灰屏,黑屏,鼠标大黑叉情况

主要解决vnc-viewer灰屏,黑屏,鼠标大黑叉等现象,详细见文档。

31.JavaScript数组进阶,一网打尽数组操作函数slice、filter、map、reduce、some、every、find、splice

上篇介绍了数组的基本概念和一些简单的数组元素操作函数,实际上,数组提供的函数还有很多。、、和是操作数组首尾两端的函数,上文已经讲过,本文不再赘述。上篇已经简单介绍过,数组就是一个特殊的对象,因此我们可以尝试使用对象的属性删除方法:。举个例子: 代码执行结果如下:注意观察图中标黄的位置,虽然元素被删除了,但是数组的长度仍然是,而且删除掉的位置多了一个。如果我们访问下标为的元素,会得到如下的结果:造成这种现象的原因是,是通过移除对应值的,也就是说删除了数组中的键值对,当我们访问下标时,就是了。而在数组中,我们常

魏大大 4182

SIMATIC S7-1200, S7-1500 PID 控制[手册]

SIMATIC S7-1200, S7-1500 PID 控制[手册]

数组常用遍历的方法 forEach()、$.each()、map()、filter()、find()、some()、 every()、reduce()

传统方法: for 循环 其他方法: 1. forEach() forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数。 注意: forEach() 对于空数组是不会执行回调函数的。 语法: array.forEach(function(currentValue, index, arr), thisValue) // currentValue 必需。当前元素 // index 可选。当前元素的索引值。 // arr 可选。当前元素所属的数组对象。 // thisValue 可选。传递给

weiwandaixu_zx的博客 1067

js中数组操作map()、filter()、some()、every()、find()、reduce()、for()、forEach()

js中数组操作map()、filter()、some()、every()、find()、reduce()、for()、forEach()

m0_70185330的博客 1710

JS数组API: push、pop 、unshift 、splice、concat...高阶函数filter、reduce、forEach、every、map

JS数组API: push、pop 、unshift 、splice、filter、reduce、concat、 forEach...

wushen的博客 1415

数组Array中的map、sort、reduce等高阶函数

Array数组常常用到,现在谈一下它的高阶函数 map() 它对于数组的每一个元素进行操作 var arr = ["1","2","3","4"] ; var arr2 = arr.map(function(x){ return x * 1 }) console.log(arr2) map() 作为高阶函数 事实上它只是把运算规则给抽象化 reduce() 它是对数组元素进行统一整合处理 例如 将...

Ajax_A的博客 564

JS数组中的迭代方法合集,看看你全掌握没有(reduce,filter,map,some,forEach...)

最近在学习算法的时候,遇到数组需要进行符合数据集提取的时候查询了一下数组中的迭代方法,这么多(╥﹏╥),不同的迭代方法使用的场景也不同,今天就和大家分享一下数组中的迭代方法和使用

qq_62012466的博客 1470

Array数组的常见的方法集合

js里面的Array数组的常见方法

前端小白的博客 4397

Array的高阶函数:map、reduce、filter、sort,every,find,findIndex,forEach

map函数: 小写,和之前的Map数据类型不一样,这个是函数。map()方法定义在JavaScript的Array中,我们调用Array的map()方法,传入我们自己的函数,就得到了一个新的Array作为结果: 'use strict'; function pow(x) { return x * x; } var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; var results = arr.map(pow); // 返回平方[1, 4, 9, 16, 25, 36

zz2230633069的博客 978

ES6——数组(方法总结)

目录 数组方法 1.Array.of()———将参数中的所有值作为元素形成数组 注意事项 数组方法 1.Array.of()——将参数中的所有值作为元素形成数组 Array.of(1,2,3,4); //[1, 2, 3, 4] Array.of(1,"2",false); //[1, "2", false] Array.of(3) //[3] Array.of(3).length //1 Array.of() //[] Array.of(null) //[null] Array.of(u

fenger_c的博客 5936

JS 数组(Array)方法总结(含ES6)

JavaScript创建数组有两种方式: (1)使用数组字面量表示法: var arr1 = []; //创建一个空数组 var arr2 = [2019];//创建一个包含一项元素的数组 var arr3 =["Json","Alan","Tony"];//创建一个包含三个字符串元素的数组 (2)使用Array构造函数: var arr4 =new Array();//创建一个空数组 var ...

HHH_LLL的博客 1154

几种操作数组的方法 forEach,each,filter,map,find,some,every,includes,reduce

①forEach          //forEach  主要是函数中 doSomthing,对数组中的每一个数据都进行操作;类似于each let numbers = [1,2,3]; let newNumbers = numbers.forEach(function (currentValue,index,arr) { console.log(currentValue) c...

qq_38180363的博客 455

JS数组方法详解

方法使用指定函数遍历数组。

m0_66217201的博客 1758
上一篇: 彻底理解JavaScript ES6中的import和export
下一篇: cookie 和 session 的区别,localstorage 和 sessionstorage 的区别
first_hands
博客等级 码龄4年 11粉丝 42原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值