//原来的格式
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. js匀速运动框架案例

    点击"开始运动"按钮,红色的#red区块开始向右匀速运动,抵达到黑色竖线位置自动停止,再次点击"开始运动"#red区块也不会再运动.同时为了便于后期维护,要求运 ...

  2. [MIT6.006] 15. Single-Source Shortest Paths Problem 单一来源的最短路径问题

    首先简单介绍下最大路径问题:给定一个加权图,找到两点之间最短加权路径,本质上就是求两点之间哪条路径的权重和最小.有两种算法去做:Dijkatra和Bellman-Ford,后面几节课会专门讲这两个算法 ...

  3. InnoDB Insert Buffer(插入缓冲 转)

    一,插入缓冲(Insert Buffer/Change Buffer):提升插入性能 只对于非聚集索引(非唯一)的插入和更新有效,对于每一次的插入不是写到索引页中,而是先判断插入的非聚集索引页是否在缓 ...

  4. IIC、SPI、UART协议总结

    IIC 特点 1.Inter-Integrated Circuit,内部集成总线,半双工 2.短距离传输,有应答,速度较慢 3.SDA双向数据线,SCL时钟线 4.可以挂载多个设备,IIC设备有固化地 ...

  5. 12.java设计模式之代理模式

    基本介绍: 代理模式(Proxy)为一个对象提供一个替身,以控制对这个对象的访问.即通过代理对象访问目标对象.这样做的好处是:可以在目标对象实现的基础上,增强额外的功能操作,即扩展目标对象的功能,想在 ...

  6. 协程实现爬虫的例子主要优势在于充分利用IO时间去请求其他的url

    # 分别使用urlopen和requests两个模块进行演示 # import requests # 需要安装的 # from urllib.request import urlopen # # ur ...

  7. Dubbo 服务导出-Version2.7.5

    1.源码分析 1.1分析服务导出入口 当容器为spring是dubbo会为容器注册两个监听器:DubboLifecycleComponentApplicationListener和DubboBoots ...

  8. 关于steam平台“wallpaper engine”软件出现界面黑屏,但壁纸能播放的问题

    前阵子重装电脑后,在使用wallpaper engine这款软件时发现了以下令人疑惑的画面: 点击"设置"和"壁纸选择"界面全是黑的......这还没完,更气人 ...

  9. java开发两年,连Spring中bean的装配都不知道?你怎么涨薪啊

    Spring 1.1.1.1 创建一个bean package com.zt.spring; public class MyBean { private String userName; privat ...

  10. 从Guarded Block来看Java中的wait和notify方法

    目录 预备知识 概览 线程同步 wait()方法 wait() wait(long timeout) wait(long timeout, int nanos) notify() & noti ...