函数式 Javascript：遍历具有嵌套对象和数组的对象时遇到问题答案

【问题标题】：Functional Javascript: Having trouble iterating through an object that has nested objects and arrays函数式 Javascript：遍历具有嵌套对象和数组的对象时遇到问题
【发布时间】：2017-03-25 02:55:59
【问题描述】：

我在尝试访问结构如下表中的数据时遇到了困难。我想要一种通过功能性 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' ]

【问题讨论】：

这很混乱，一般你会做tables.table2.headings[0]，你会怎么用函数式编程或Ramda来做呢？
请阅读How to Ask。关键词：“搜索和研究”和“解释......任何阻碍你自己解决的困难”。
能否请您更新问题，并定义您所说的访问我的数据是什么意思？
是啊，太令人困惑了..我正在处理别人的项目，并要求以这种方式进行。过去一天我一直在玩 Ramda，但一直在努力获得我需要的东西。
你需要做什么？？似乎很奇怪有人问你“请用 Ramda 访问这些数据”，这个任务一定有更多的特殊性。

标签： javascript arrays functional-programming ecmascript-6 ramda.js

【解决方案1】：

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]);
        }
    }   
}

大量关于循环对象和数组的示例

【讨论】：

【解决方案2】：

如果您要问如何枚举数据结构，可以使用以下方法：

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
  });
});

【讨论】：

谢谢@skav！正是我所追求的。

【解决方案3】：

如果你想做的是转换数据（而不是处理一些副作用），那么 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 上看到这一点。

【讨论】：