为什么在函数内部调用的函数返回空值？

Question

我有一个在页面加载时启动的功能。 假定从数组/列表返回一个字符串项。 我已经对其进行了测试，它似乎可以正常工作：

function finder(file_list, evt_name) {
  file_list.forEach(function (item, index) {
      if (item.includes(evt_name)){
        console.log(item);
        return item;
      }
  });
}

我有一个由按钮单击事件触发的第二个功能。 在此函数内部，我调用了第一个函数（“ finder”）：

document.getElementById("btnGetInterval").onclick = function () {
  ...
  var t_file = finder(tidal_files, event);
  var rv_file = finder(river_files, event);
  var rn_file = finder(rain_files, event);
...
}

在控制台中，调用'finder'功能时，它将正确地console.log(item)' ；当它到达断点时，它表明将返回正确的item ，但是当它在按钮单击功能内部返回时，在我尝试将返回值分配给变量的地方，它显示为'undefined' 。 有什么原因会发生这种情况？ 有什么办法解决吗？

Answer 1

.forEach始终从MDN返回undefined ：

forEach()对每个数组元素执行一次callback函数； 与map()或reduce()它始终返回undefined的值并且不可链接。 典型的用例是在链的末端执行副作用。

您可以改用.find并且必须在file_list.find(function (item, index) {之前添加return ：

function finder(file_list, evt_name) {
    return file_list.find(function (item, index) {
        console.log(item);
        return item.includes(evt_name);
    });
}

Answer 2

您可以使用find 。

function finder(file_list, evt_name) {
    return file_list.find(function (item, index) {
        return item.includes(evt_name);
    });
}