【Lodash】 Filter 与Map 的结合使用

用Filter过滤数据之后,想给某个字段重新赋值

在使用 `filter()` 方法过滤数据后,如果你想给某个字段赋值,你可以使用 `map()` 方法来修改数组中的元素。`map()` 方法可以对数组中的每个元素应用一个函数,并返回一个新的数组。

以下是一个示例代码,演示了如何在过滤数据后给某个字段赋值:

javascript 复制代码
const items = [

  { id: 1, name: 'Apple', price: 1.5 },

  { id: 2, name: 'Orange', price: 2.0 },

  { id: 3, name: 'Banana', price: 1.0 },

  { id: 4, name: 'Grapes', price: 2.5 },

];



const filteredItems = items

  .filter(item => item.price > 1.5) // 过滤价格大于 1.5 的项目

  .map(item => ({ ...item, discounted: true })); // 给过滤后的项目添加一个字段 "discounted"



console.log(filteredItems);

上述代码会在过滤数据后,给符合条件的项目添加一个名为 "discounted" 的字段,并将其值设置为 `true`。最终输出的 `filteredItems` 数组将包含符合过滤条件的项目,并且每个项目都会具有新添加的 "discounted" 字段。需要注意的是,这里使用了对象扩展操作符 `{ ...item }` 来克隆原始项目对象,以便修改其属性。

相关推荐
IT_陈寒12 小时前
为什么我的React状态更新总是不按套路出牌?
前端·人工智能·后端
小二·12 小时前
WebGPU 浏览器端跑大模型:让AI在网页里跑起来(WebLLM/Transformers.js实战)
开发语言·javascript·人工智能
小猴子爱上树12 小时前
Temu批量视频翻译Python实现方案
开发语言·python·音视频
心中有国也有家12 小时前
AtomGit Flutter 鸿蒙客户端:零外部资源的应用打包策略
android·javascript·flutter·华为·harmonyos
IDIOSF12 小时前
R语言 下载安装教程(附安装包)R语言4.5安装步骤(保姆级)
开发语言·其他·r语言
恋猫de小郭12 小时前
Fluter 共享内存多线程正在落地,IsolateGroupBound 来了
android·前端·flutter
乱七八糟的屋子12 小时前
LibYAML超全教程-C语言YAML解析与生成
c语言·开发语言·配置文件·yaml解析·libyaml·开源库实战
paopaokaka_luck12 小时前
基于Springboot3+Vue3的宠物殡葬管理系统(webSocket实时通讯、接入腾讯地图、支付宝沙盒支付、Echarts图形化分析)
java·开发语言·网络·后端
十铭忘12 小时前
Vue3实现Pixso中的钢笔工具3——梳理函数调用
前端·vue.js
逝水无殇12 小时前
HTML 元素详解
开发语言·前端·html