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

相关推荐
大江东去浪淘尽千古风流人物12 小时前
【HexVIO】DSP卸载双目惯性VIO:Hexagon向量化前端与单帧融合调度深度解析
前端·状态模式·slam·dsp·vio·hexagon·移动端加速
এ慕ོ冬℘゜12 小时前
JS 事件循环、宏任务微任务:单线程底层原理 + 执行顺序
开发语言·javascript·ecmascript
其实防守也摸鱼12 小时前
Chrome 扩展安全攻防实录:从攻击面到防御实践
开发语言·前端·网络·chrome·安全·web安全·php
web打印社区12 小时前
Lodop排障总纲-常见报错一张表
开发语言·前端·javascript·chrome·websocket
李剑一13 小时前
为什么几乎所有的知名开源项目都是外国人写的?
前端·ai编程·deepseek
小郎君65813 小时前
(一)为什么表单需要第三种状态:disabled、readonly 与纯文本展示
前端·vue.js
计算机魔术师13 小时前
1.4万亿没人接,OpenAI自己砍了1500亿
前端
程序员大阳13 小时前
副队长JavaScript教程(56)-DOM之表单操作
javascript·dom·表单操作
Dxy123931021614 小时前
JS AES加密详解
开发语言·javascript·ecmascript
溪语流沙14 小时前
【每天一个CSS | Day41】开关三连:一套状态机,三种视觉翻译
前端·css·html5·每日一练·按钮