Javascript循环：for循环有效但不映射？

我正在为一个web应用程序使用mockData，并尝试在嵌套对象上循环。我的问题是for循环有效，但array.map无效，我不知道为什么

下面是for循环：

  for (let i = 0; i < fakeChartData.length; i++) {
    for (let j = 0; j < fakeChartData[i].poll.length; j++) {
      if (fakeChartData[i].poll[j].id === id) {
        return fakeChartData[i].poll[j]
      }
    }
  }

我的数据结构：

fakeChartData = [
  {
    id: '232fsd23rw3sdf23r',
    title: 'blabla',
    poll: [{}, {}]
  },
  {
    id: '23dgsdfg3433sdf23r',
    title: 'againBla',
    poll: [{}, {}]
  }
];

我正在尝试加载特定对象，并在onClick方法上向其传递id。 以下是完整的功能：

export const fetchPollOptById = (id) =>
  delay(500).then(() => {
    for (let i = 0; i < fakeChartData.length; i++) {
      for (let j = 0; j < fakeChartData[i].poll.length; j++) {
        if (fakeChartData[i].poll[j].id === id) {
          return fakeChartData[i].poll[j]
        }
      }
    }
});

export const fetchPollOptById=（id）=>
延迟（500）。然后（（）=>{
for（设i=0；i

试试这个

fakeChartData.map(data => {
    var result = data.poll.map(data => {
      if (data.id === id) {
        return data;
      }
    });
    return result;
  });

---

它应该会起作用。是的，我认为应该使用

find（）

而不是

map（）

。

有点长的实现：

let results = fakeChartData.map(data => {
    let innerResult = data.poll.filter(data => {
      if (data.id === id) {
        return data;
      }
     return innerResult.length ? innerResult[0] : null;
    });
  })
  .filter(x => (x !== null));
let whatYouwant = results.lenght ? results[0] : null;

---

如果您可以使用find（），它看起来会更好，但这取决于您需要支持的浏览器。

如果我对您尝试执行的操作的看法是正确的，那么这应该可以工作：

return fakeChartData.reduce((acc, data) => acc.concat(data.poll), [])
                    .filter(pollObj => pollObj.id === id)[0]

首先，它生成一个数组，其中包含来自不同数据对象的所有轮询对象，然后对它们进行过滤，以找到具有正确id的对象并返回该对象

至于为什么你使用

map

的方法不起作用：你用错了方法。

map

的作用是获取一个函数并将其应用于数组的每个成员

这是一个类似于您的数组和函数：

const arr = [1,2,3]
const getThingById(id) => {
  var mappedArray = arr.map(x => {
    if(x === id) return x
  })
  console.log(mappedArray) // [3]
}
getThingById(3) // undefined

---

这行不通

getThingById

没有返回语句。return语句

return x

是从传递到map的函数返回内容。基本上，你不应该使用

map

来做你想做的事情

map

用于返回数组。

for循环中的return语句会导致函数返回。但是，.map（）函数回调中的return语句只返回回调，然后将返回的值放入新数组中。请参阅。如果确实要使用.map（），可以这样做：

export const fetchPollOptById = (id) => {
    var result;
    fakeChartData.map(data => {
        data.poll.map(data => {
            if (data.id === id) {
                result = data;
                return data;
            }
        });
    });
    return result;
}

  fakeChartData = [
      {
          id: '232fsd23rw3sdf23r',
          title: 'blabla',
          poll: [
              {id: 'pollId1', otherField: 'blah'},
              {id: 'pollId2', otherField: 'blah'}
          ]
      },
      {
          id: '23dgsdfg3433sdf23r',
          title: 'againBla',
          poll: [
              {id: 'pollId3', otherField: 'blah'},
              {id: 'pollId4', otherField: 'blah'}
          ]
      }
  ];

fetchPollOptById("pollId3"); //returns {id: "pollId3", otherField: "blah"}

注意：我还假设您的轮询对象具有如下id字段：

export const fetchPollOptById = (id) => {
    var result;
    fakeChartData.map(data => {
        data.poll.map(data => {
            if (data.id === id) {
                result = data;
                return data;
            }
        });
    });
    return result;
}

  fakeChartData = [
      {
          id: '232fsd23rw3sdf23r',
          title: 'blabla',
          poll: [
              {id: 'pollId1', otherField: 'blah'},
              {id: 'pollId2', otherField: 'blah'}
          ]
      },
      {
          id: '23dgsdfg3433sdf23r',
          title: 'againBla',
          poll: [
              {id: 'pollId3', otherField: 'blah'},
              {id: 'pollId4', otherField: 'blah'}
          ]
      }
  ];

fetchPollOptById("pollId3"); //returns {id: "pollId3", otherField: "blah"}

然后，您可以获得如下所示的投票数据：

export const fetchPollOptById = (id) => {
    var result;
    fakeChartData.map(data => {
        data.poll.map(data => {
            if (data.id === id) {
                result = data;
                return data;
            }
        });
    });
    return result;
}

  fakeChartData = [
      {
          id: '232fsd23rw3sdf23r',
          title: 'blabla',
          poll: [
              {id: 'pollId1', otherField: 'blah'},
              {id: 'pollId2', otherField: 'blah'}
          ]
      },
      {
          id: '23dgsdfg3433sdf23r',
          title: 'againBla',
          poll: [
              {id: 'pollId3', otherField: 'blah'},
              {id: 'pollId4', otherField: 'blah'}
          ]
      }
  ];

fetchPollOptById("pollId3"); //returns {id: "pollId3", otherField: "blah"}

---

您应该提供一个数据结构的示例…这是如何运行的？我们在测试中使用array.map时遇到问题。它们使用jasmine和phantom.js运行。Phantom.js似乎缺少对array.map的支持考虑一下

map

中的

return

语句返回的是什么。if语句让我觉得你把.map（）和.filter（）弄混了。map应始终返回一个值，而filter用于返回仅包含满足条件的元素的数组

map

执行完全不同的操作。你当初为什么要用它？“我确实尝试使用.filter（），但它似乎返回原始数据，而不是计算数据”，就像您的代码一样。你的观点是什么？.find不受这些作品的支持，但我正在研究.map（）为什么不起作用。我已经有了使用普通for-loops的示例。您的map示例不起作用，因为return语句只退出第二个回调。两个回调仍将迭代整个数组。从示例中得到的数组将只包含未定义的@谢谢你的解释。其他人只是给了我他们的解决方案，没有提到“因为”。Thanks@otajor我会接受你的答案，因为这是最短的，也是不变的。为接受干杯-我刚刚编辑了一些关于为什么地图不起作用的解释。我建议你多读一些关于

map

、

filter

、

reduce

和

forEach

的书，并弄清楚你应该在什么时候使用每一本。我现在就知道了，伙计，不过还是谢谢你。虽然，你的答案接近我想要的，但我已经接受了其他人的答案，但如果我能再做一次，那就是你的答案。您好您可以选择更改已接受的答案，因为您是问题的作者，但只有在您认为我的答案对您更有帮助的情况下才可以这样做。看见