【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 }` 来克隆原始项目对象,以便修改其属性。

相关推荐
囊中之锥.几秒前
《HTML 网页构造指南:从基础结构到实用标签》
前端·html
饼饼饼1 分钟前
从 0 到 1:前端 CI/CD 实战(第二篇:用Docker 部署 GitLab)
前端·自动化运维
qq_406176141 分钟前
JavaScript的同步与异步
前端·网络·tcp/ip·ajax·okhttp
Felven2 分钟前
C. Contrast Value
c语言·开发语言·算法
beckyyy9 分钟前
ant design vue Table根据数据合并单元格
前端·ant design
小脑虎9 分钟前
JavaScript 进阶核心文档(零基础衔接版,通俗易懂 2025最新)
javascript
用户81686947472510 分钟前
Commit 阶段的 3 个子阶段与副作用执行全解析
前端·react.js
岭子笑笑11 分钟前
Vant4图片懒加载源码解析(一)
前端
我的xiaodoujiao13 分钟前
使用 Python 语言 从 0 到 1 搭建完整 Web UI自动化测试学习系列 37--测试报告 Allure 前置步骤-配置安装 JDK 详细图文教程
java·开发语言·学习·测试工具
老华带你飞14 分钟前
婚纱摄影网站|基于java + vue婚纱摄影网站系统(源码+数据库+文档)
java·开发语言·前端·数据库·vue.js·spring boot