功能性Javascript：遍历具有嵌套对象和数组的对象时遇到麻烦

Question

我在尝试访问如下结构的表中的数据时遇到困难。 我想要一种干净有效的方法，通过功能性Javascript方法访问嵌套数据。 如果有人能展示如何使用Ramda或纯ES6来实现此功能，将不胜感激！ 请参见下面的示例表结构。

---

let tables = {
  table1: {
    headings: [ 'hey', 'there' ],
    rows: [ 'row 1 here', 'row 2 here' ],
  },
  table2: {
    headings: [ 'sup', 'yall' ],
    rows: [ 'row1 3 here', 'row 4 here' ],
  },
  table3: {
    headings: [ 'what', 'up' ],
    rows: [ 'row 5 here', 'row 6 here' ],
  },
}

编辑

我正在使用React，我的最终目标是在表格组件内构造每个表，因此我希望能够在组件const headings = [ 'hey', 'there' ] const rows = [ 'row 1 here', 'row 2 here' ]

Answer 1

如果您询问如何枚举数据结构，则可以执行以下操作：

 let tables = { table1: { headings: ['hey', 'there'], rows: ['row 1 here', 'row 2 here'], }, table2: { headings: ['sup', 'yall'], rows: ['row1 3 here', 'row 4 here'], }, table3: { headings: ['what', 'up'], rows: ['row 5 here', 'row 6 here'], }, }; Object.keys(tables).forEach((tableId) => { tables[tableId].headings.forEach((heading) => { // do something with heading }); tables[tableId].rows.forEach((row) => { // do something with the row }); }); 

Answer 2

如果您想要做的是转换数据（而不是处理数据上的一些副作用），那么Ramda确实有一些工具可以使数据变得更容易，尤其是evolve 。

如果您有想要用于诸如此类的body元素的函数：

const surround = (tag) => (content) => `<${tag}>${content}</${tag}>`;

而您想将标题大写，则可以使用如下所示的内容

R.map(R.evolve({
  headings: R.map(R.toUpper),
  rows: R.map(surround('td'))
}))(tables);

您可以在Ramda REPL上看到这一点。

Answer 3

for (var key in tables ) {
    for (var innerKey tables[key] ) {
        for (var i = 0; i < tables[key][innerKey].length; i++) {
            console.log(tables[key][innerKey][i]);
        }
    }   
}

关于遍历对象和数组的大量示例