javascript - 如何将嵌套的 for 循环转换为 javascript 中的声明语句

Question

使用map,filter,reduce等函数式方法，如何将命令式的嵌套for循环转换为声明式函数。以下面为例:

getTxns: function () {
    var txnsToCheck = [];
    var pages = this.data;
    for (var i = 0; i < pages.length; i++) {
        var page = pages[i];
        var txns = [];
        for (var j = 0; j < page.txns.length; j++) {
            if (page.txns[j].grade) {
                txnsToCheck.push({ page: i, txn: j, virtual: false });
        }
        else {
            txnsToCheck.push({ page: i, txn: 0, virtual: true });
        }
    }

    return txnsToCheck;
},

下面是功能重写的无效尝试，最后一张 map 不起作用，但我相信说明了意图，这是一个条件赋值。

getTxns: function () {
    return this.data.
        map(function (page) {
            return page.txns.
                map(function(txn){
                    if (txn.grade){
                        return {page: txn.page_idx, txn: page.txns.indexOf(txn), virtual: false}
                    } else {
                        return {page: txn.page_idx, txn: 0, virtual: true}
        }
    })
})

我考虑过过滤器，但不清楚是否可以在一次操作中遍历链返回第二个过滤器和映射？

想知道 for 循环的有效声明版本是什么样的。

这是数据模式的示例:

"derived": [
  {
    "page_idx": 0,
    "page_image_url": "",
    "doc_pk": 123456,
    "txns": [
      {
        "page_idx": 0,
        "grade": 0,
        "explanation": "test 1",
        "id": 1962754,
      },
      {
        "page_idx": 0,
        "is_recurring": false,
        "bank_account_pk": null,
        "grade": 0,
        "explanation": "test 2",
        "id": 1962753,
      },
   ]
  },
  {
    "page_idx": 1,
    "page_image_url": "",
    "doc_pk": 2654321,
    "txns": []
  },
  {
    "page_idx": 2,
    "page_image_url": "",
    "doc_pk": 123457,
    "txns": []
  }
]

Answer 1

@eclanrs 提到的可能是这样的

getTxns: function () {
    return this.data.reduce(function (accumulator, page) {
        return accumulator.concat(page.txns.map(function(txn){ 
                return {
                    page: txn.page_idx,
                    txn: txn.grade ? page.txns.indexOf(txn) : 0,
                    virtual: !txn.grade
                }
        })) ;
    }, []);
},

fiddle