RxJS 将三元组中的属性组合到表格中 [英] RxJS to combine attributes from triples to a table

问题描述

我有一个服务产生类似三元组的对象.它们将采用以下格式:

I have a service producing objects that are like triples. They will be in this format:

{ country, attribute, value }

示例:

{ country: 'usa',    attribute: 'population', value: 100 }
{ country: 'mexico', attribute: 'population', value: 200 }
{ country: 'usa',    attribute: 'areaInSqM',  value: 3000 }

最终我想将这些显示为表格.行是国家，列是属性.所以表格看起来像:

Ultimately I want to display these as a table. Rows are countries, columns are attributes. So the table would look like:

| country | population | areaInSqM |
| usa     | 100        | 3000      |
| mexico  | 200        |           |

我的假设(可能是错误的)是我需要创建一个中间数据结构，它是一个行数组.如:

My assumption (possibly wrong) is that I need to create an intermediate data structure that is an array of rows. Such as:

[ { country: 'usa', population: 100, areaInSqM: 3000 }, .... ] 

我当前的解决方案是一个非 RxJS 对象的混乱，我存储一个包含每个属性类型的 Set，存储一个按国家/地区索引的查找对象，最后将查找对象转换回上述数组.我希望避免大量循环和双重存储.

My current solution is a non-RxJS mess of objects where I store a Set containing each attribute type, store a lookup object indexed by country, and convert the lookup object back to the above array at the end. Lots of looping and double storage that I'd prefer to avoid.

RxJS 是否有任何操作符可以帮助进行此类操作?

Does RxJS have any operators that aid in this type of operation?

有更聪明的方法吗?

在这种特殊情况下，假设是:

In this particular case, assumptions are:

• 无法提前知道属性
• 值总是数字
• 给定的单元格"可以为空.在此示例中，从未提供墨西哥 areaInSqM

Plunkr 与解决方案:https://plnkr.co/edit/FVoeVmmzMN7JGJ3zWFQM?p=preview

Plunkr with solution: https://plnkr.co/edit/FVoeVmmzMN7JGJ3zWFQM?p=preview

推荐答案

您的问题中有两个组成部分，数据结构部分和数据流部分(我假设您将这些数据作为流获取，即一个接一个，这就是你使用 Rxjs 的原因).

There are two components in your question, the data structure part, and the data flow part (I suppose you get these data as a stream i.e. one by one, hence the reason why you use Rxjs).

迭代构建数据结构的一种简单方法是使用 scan 运算符.例如:

A simple way to iteratively build you data structure is to use the scan operator. For instance :

myDataStructure$ = dataSource$.scan(function (accDataStructure, triple){
  accDataStructure[triple.country] = accDataStructure[triple.country] || {}
  accDataStructure[triple.country][triple.attribute] = accDataStructure[triple.country][triple.attribute] || {}
  accDataStructure[triple.country][triple.attribute] = triple.value
  return accDataStructure
}, {})

假设 dataSource$ 生成形状为 { country, attribute, value } 的对象.然后 myDataStructure$ 将为每个传入的数据输出您正在寻找的迭代构建的数据结构.如果您只需要完成构建后的数据结构，只需将 .last() 添加到 myDataStructure$.

That makes the assumption that dataSource$ produces objects of the shape { country, attribute, value }. Then myDataStructure$ will output, for every incoming data, the iteratively built data structure that you are seeking. If you only want that data structure once it is finished building, just add a .last() to myDataStructure$.

这没有经过测试，所以让我知道它是否有效

This is not tested so let me know if that worked

这篇关于RxJS 将三元组中的属性组合到表格中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！