使用reduce处理数据

一.reduce的使用方法


😆reduce方法需要传递两个参数一个参数是回调函数,另外一个参数是初始值,回调函数接收四个值分别是,accumulator累计值,currentValue当前值,currentIndex当前索引值,array原始数组,回调函数的返回值作为下次累计的初始值,使用方法如下:

js 复制代码
array.reduce((accumulator,currentValue,currentIndex,array)=>{
  return updatedAccumulator
},initialValue)

二.开发真实案例


🐸如下原数据,将这个原数据使用reduce处理成新的数据,并且只能使用reduce,不能使用其他函数访问。

js 复制代码
const data = [
  {
    "zscp1": {
      "zscpFlag": true,
      "zscpFs": "90"
    }
  },
  {
    "zscp2": {
      "zscpFlag": true,
      "zscpFs": "100"
    }
  },
  {
    "zscp3": {
      "zscpFlag": false,
      "zscpFs": ""
    }
  }
];

🦉处理后的数据格式:

js 复制代码
{
  "zscp1": {
    "zscpFlag": true,
      "zscpFs": "90"
  },
  "zscp2": {
    "zscpFlag": true,
      "zscpFs": "100"
  },
  "zscp3": {
    "zscpFlag": false,
      "zscpFs": ""
  }
}

🤡处理代码:

js 复制代码
this.csfsInfo = res.reduce((acc, cur) => {
  let key = Object.keys(cur)[0];
  let value = cur[key];
  return { ...acc, ...{ [key]: value } };
}, {});
相关推荐
甲维斯13 小时前
《钢铁洪流》官网搞定,纯AI制作,Opus5操刀!
前端·人工智能·游戏开发
szephyr13 小时前
WebSocket 实战:心跳、断线重连、鉴权,一次讲清
前端·websocket·node.js·长连接·实时通信
默_笙14 小时前
🚋 从流水线到地铁网:为什么复杂 AI 都要拆成多 Agent(上)——LangGraph 基础入门
前端·javascript
科技苑14 小时前
前后端分离与微服务架构如何协同?
前端·后端·前端框架
神秘的猪头14 小时前
TypeScript 高级用法全解析:从泛型到 infer,把类型系统真正用起来
前端·typescript
moMo14 小时前
React Hooks 与闭包
前端·react.js
柚yuzumi15 小时前
彻底搞懂 JavaScript 类型转换:显式转换、隐式转换与 ToPrimitive
前端·javascript·node.js
向北丶15 小时前
vscode 导入语句排序和删除未使用的导入
前端·visual studio code
PHP实战开发录15 小时前
PHP接口偶发变慢怎么查
前端·php·开发