为什么 .forEach 返回未定义？

Question

我知道这个话题已经有多个问题https://stackoverflow.com/search?q=%5Bjavascript%5D+return+forEach+undefined但这些似乎都没有帮助我。

所以我有以下数据：

 const testsMap = {
            0: ["just", "test"],
            1: ["bla", "asdf"]
        }

 const testArray = [{
    id: "1",
    segments: null,
    tests: [{
            id: "1",
            segments: "1"
        },
        {
            id: "2",
            segments: "0"
        }
    ]
},
{
    id: "2",
    segments: "1",
    tutorials: [{
            id: "1",
            segments: "1"
        },
        {
            id: "2",
            segments: "0"
        }
    ]
}];

我想在不使用.map()或.reduce情况下实现输出，因为我不想要一个新数组，我只想覆盖现有数组，如下所示：

[{
    display: true,
    id: "1",
    segments: null,
    tests: [{
            display: true,
            id: "1",
            segments: "1",
            newSegments: ["bla", "asdf"]
        },
        {
            display: true,
            id: "2",
            segments: "0",
            newSegments: ["just", "test"]
        }
    ]
},
{
    display: false,
    id: "2",
    segments: "1",
    tutorials: [{
            id: "1",
            segments: "1"
        },
        {
            id: "2",
            segments: "2"
        }
    ]
}];

我的函数看起来像这样 - 请注意它有一些你可以忽略的辅助 fns - 只是 fn 返回undefined ：

function SOtest () {
  const returnedValue = testArray.forEach(test => {
    test.newSegments = test.segments ? testsMap[test.segments] : [];
    test.display = helperFn(); // will add true/false to the test prop

    if (test.display) {
      test.tests.map(t => {
        t.newSegments = t.segments ? testsMap[t.segments] : [];
        t.display = helperFn(); // will add true/false to the test prop
      })
    }
    return test;
  })
  return returnedValue;
}

现在forEach本身在控制台中自己执行时工作得很好 - 但是一旦我想返回它，它就等于undefined 。

我错过了什么？

Answer 1

forEach不返回任何内容。 它只是循环遍历元素，循环时您可以更改元素数据

所以你可以改变你的功能SOtest到

function SOtest () {
  testArray.forEach(test => {
    test.newSegments = test.segments ? testsMap[test.segments] : [];
    test.display = helperFn(); // will add true/false to the test prop

    if (test.display) {
      test.tests.map(t => {
        t.newSegments = t.segments ? testsMap[t.segments] : [];
        t.display = helperFn(); // will add true/false to the test prop
      })
    }
  })
  return testArray;
}

Answer 2

根据mdn forEach

forEach() 对每个数组元素执行一次回调函数； 与 map() 或 reduce() 不同，它总是返回未定义的值并且不可链接。 典型的用例是在链的末端执行副作用。

Answer 3

根据 MDN：

.map() 返回“一个新数组，每个元素都是回调函数的结果。”

.forEach() 返回未定义。

如果您循环的代码是连续的，请使用 .map()，否则 .forEach() 就可以了。

资料来源：

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map