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

相关推荐
Ashley的成长之路29 分钟前
前端性能优化实战手册·第2篇:资源加载策略全解
前端·性能优化·资源加载·http/3·性能优化实战·资源加载优化
浅水壁虎34 分钟前
vue基础(第二章 )
前端·javascript·vue.js
界面开发小八哥34 分钟前
界面控件DevExtreme v26.1新版亮点——支持Angular 22
前端·javascript·angular.js·devexpress·ui开发·devextreme
Getflare39 分钟前
前端 + UI 设计 + AI:这不是三个工种,是一个新三角能力模型(附自检清单)
前端·人工智能·ui
moonsims41 分钟前
星闪在跨域无人化系统作用
开发语言·php
oil欧哟1 小时前
我做了一个 Vibe Coding 术语学习站:VibeHub
前端·ai·agent·独立开发·vibe coding
Iruoyaoxh1 小时前
栈和队列~
java·开发语言
审小匠OpenCPAi2 小时前
银行流水核查怎么自动化?单边匹配、双向勾稽与图聚类异常检测的工程对比
java·前端·人工智能·python·审计
Hrain-AI2 小时前
2026 企业 AI 编程智能体实战:Codex 与 Claude Code
开发语言·人工智能·kotlin