//原来的格式
const PRODUCTS = [
{ category: 'Sporting Goods', price: '$49.99', stocked: true, name: 'Football' },
{ category: 'Sporting Goods', price: '$9.99', stocked: true, name: 'Baseball' },
{ category: 'Sporting Goods', price: '$29.99', stocked: false, name: 'Basketball' },
{ category: 'Electronics', price: '$99.99', stocked: true, name: 'iPod Touch' },
{ category: 'Electronics', price: '$399.99', stocked: false, name: 'iPhone 5' },
{ category: 'Electronics', price: '$199.99', stocked: true, name: 'Nexus 7' }
];
//需要的格式 (就是把公共的标题提取出来了)
const res=[{ category: 'Sporting Goods' },
{
product:
{
category: 'Sporting Goods',
price: '$49.99',
stocked: true,
name: 'Football'
}
},
{
product:
{
category: 'Sporting Goods',
price: '$9.99',
stocked: true,
name: 'Baseball'
}
},
{
product:
{
category: 'Sporting Goods',
price: '$29.99',
stocked: false,
name: 'Basketball'
}
},
{ category: 'Electronics' },
{
product:
{
category: 'Electronics',
price: '$99.99',
stocked: true,
name: 'iPod Touch'
}
},
{
product:
{
category: 'Electronics',
price: '$399.99',
stocked: false,
name: 'iPhone 5'
}
},
{
product:
{
category: 'Electronics',
price: '$199.99',
stocked: true,
name: 'Nexus 7'
}
}] let rows = [];
//记录最后一个分类的值,初始值为null
let lastCategory = null;
PRODUCTS.forEach(item => {
if (item.category !== lastCategory) {
rows.push({ category: item.category })
}
rows.push({ product: item })
lastCategory = item.category;
})
console.log(rows)

  

将一个数组转化为需要的格式,来自react官网的商品列表示例的更多相关文章

  1. 验证Xcode真伪的方法,来自苹果官网

    验证Xcode真伪的方法,来自苹果官网   Xcode的验证你的版本 2015年9月22日    注意:中文为有道翻译,看下验证方法即可.   我们最近将应用程序从应用程序商店,还建有Xcode的假冒 ...

  2. Reveal常用技巧(翻译来自Reveal官网blog)

    翻译来自官网:http://revealapp.com/blog/reveal-common-tips-cn.html 以下基于Reveal 1.6. 用于快速上手的内置应用 刚刚下载Reveal,啥 ...

  3. 省市县镇村五级地址智能提取(标准地址源来自国家统计局官网)SpringBoot+Elasticsearch 5.6

    项目目的 根据传入的地址,智能提取所属的省市县镇村5级地址.例如:用户输入“江苏南通嗨安李堡镇陈庄村8组88号”,我们需要提取到江苏省  南通市  海安县(即便用户输入了错字,“海”写成了“嗨”) 李 ...

  4. jQuery选择器最佳实践--来自jQ官网

    1.基于ID选择器进行查询,并且使用find方法. //快速 $("#container div.footer"); //超快 $("#container"). ...

  5. consul eureka区别(来自Consul官网)

    consul 与 eureka Eureka是一个服务发现工具.该体系结构主要是客户端/服务器,每个数据中心有一组Eureka服务器,通常每个可用区域一个.通常Eureka的客户使用嵌入式SDK来注册 ...

  6. C语言中数组转化为字符串的方法

    #include<stdio.h> #include <stdlib.h> #include <string.h> #define NR(x) (sizeof(x) ...

  7. Arrays -数组工具类,数组转化字符串,数组排序等

    package cn.learn.basic; import java.util.Arrays; /* java.util.Arrays是一个与数组相关的工具类,含有大量静态方法,用来实现数组常见的操 ...

  8. http_build_query()就是将一个数组转换成url 问号?后面的参数字符串,并且会自动进行urlencode处理,及它的逆向函数

    http_build_query()就是将一个数组转换成url 问号?后面的参数字符串,并且会自动进行urlencode处理 例如: $data = array( 'foo'=>'bar', ' ...

  9. C#- 将秒数转化成任意时间格式

    将秒数转化成任意时间格式,可以使用C#的一个函数TimeSpan,看示例: TimeSpan ts = new TimeSpan(0, 0, 3661); richTextBox2.Text = ts ...

随机推荐

  1. linux 协议栈 实现--编码小知识分析

    unlikely 以及likely 作用: rcu_read_lock  以及rcu_read_unlock 作用: rcu_dereference .rcu_dereference_protecte ...

  2. Java基础 之一 基本知识

    Java基础 之一 基本知识 1.数据类型 Java有8种基本数据类型 int.short .long.byte.float.double.char.boolean 先说明以下单位之间的关系 1位 = ...

  3. create-react-app添加对TypeScript支持

    背景 最近一直在重构react项目,由于项目历史原因,将之前parcel打包工具换成了webpack,并选择了使用create-react-app作为项目开发脚手架. 接着就是把项目中flow类型检查 ...

  4. 为什么删除的Ceph对象还能get

    前言 在很久以前在研究一套文件系统的时候,当时发现一个比较奇怪的现象,没有文件存在,磁盘容量还在增加,在研究了一段时间后,发现这里面有一种比较奇特的处理逻辑 这套文件系统在处理一个文件的时候放入的是一 ...

  5. ubuntu13.04修改默认启动内核

    ubuntu下面的启动内核选项跟其他操作系统不一样,有个子菜单,比如我在默认的ubuntu13.04上安装了一个新的内核3.14.5,那么默认的第一项是3.14.5内核,第二项是一个子菜单,第二项里面 ...

  6. @Autowired自动装配原理

    在类中为类名添加 @Auwowired注解,为该类在spring中注册成组件 1,先按照类型在容器中找对应的组件:找到一个, 直接赋值,一个都没找到, 抛异常 2,找到了多个:按变量名作为ID继续匹配 ...

  7. 【芯片手册开发】Sil9136音频开发详细分析+源码实战

    目录 前言 参考 手册使用+实战 配置 Configuring Audio Using I2S 总结实现 前言 默认在开发了视频方面后 这方面的工作本来可以找技术支持拿个例程参考下,很快就可以的写出来 ...

  8. 使用Ant将项目打成war包

    现在很多项目Java基本都是基于maven管理的,maven对于jar包管理和打包的方便这里就不再赘述,但是如果没有使用maven管理如何将一个Java Web项目打成war包呢,这里推荐使用Ant. ...

  9. .net core quartz job作业调度管理组件

    定时作业对于多数系统来说,都会用到,定时作业的实现方式可以有多种方式,简单的方式用Timer就可以实现,但是达不到通用的效果,本文采用Quartz基础组件来搭建一套企业通用的作业调度管理服务,希望对于 ...

  10. Mate 40系列发布 搭载华为运动健康服务带来健康数字生活

    10月30日,HUAWEI Mate 40系列国内发布会如期而至.Mate 40系列除了拥有强悍的性能.全能记录影像和突破性的交互之外,还搭载了全新升级的HMS Core,其中,Health Kit( ...