Javascript映射返回undefined，即使条件正确并且项存在

Question

handleGetDiscussion = (discussionId) => {
const discussionList = [...this.state.discussionList];
console.log("The discussionList", discussionList);
discussionList.map((discussion) => {
if (discussion._id === discussionId) {
return discussion;
}
});
// return discussionList.filter(
//   (discussion) => discussion._id === discussionId
// );
};

以上是从discussionList中获取某个讨论的函数。然而，出于某种原因，当我将返回值分配给一个变量时，例如：

const selectedDiscussion = this.handleGetDiscussion(discussionId);

即使discussion._id和discussionId存在，它也会从map函数返回undefined，这是真的(使用控制台日志检查(，但不知何故，它没有返回discussion，而是返回undefined。另一方面，如果我将map函数更改为filter，它就会起作用。我可以知道这背后的原因是什么吗？

Answer 1

尝试

handleGetDiscussion = (discussionId) => {
const discussionList = [...this.state.discussionList];
let result;

discussionList.forEach((discussion) => {
if (discussion._id === discussionId) {
result = discussion;
}
});
return result;
};

Answer 2

您的函数没有返回任何与返回undefined:相同的内容

handleGetDiscussion = (discussionId) => {
const discussionList = [...this.state.discussionList];
console.log("The discussionList", discussionList);
discussionList.map((discussion) => {
if (discussion._id === discussionId) {
return discussion;
}
});
// return discussionList.filter(
//   (discussion) => discussion._id === discussionId
// );
// not returning anything therefore this is the same
// as returning undefined!
};

map中的return用于(discussion) => {功能，而不是handleGetDiscussion = (discussionId) => {:

handleGetDiscussion = (discussionId) => {
const discussionList = [...this.state.discussionList];
console.log("The discussionList", discussionList);
discussionList.map((discussion) => { <---------------. The return                 
if (discussion._id === discussionId) {             | belongs to
return discussion;     --------------------------' this function
}
});
// return discussionList.filter(
//   (discussion) => discussion._id === discussionId
// );
};

如果您只想返回第一个找到的讨论，则需要使用常规的for或while循环：

handleGetDiscussion = (discussionId) => {
const discussionList = [...this.state.discussionList];
console.log("The discussionList", discussionList);
for (let i=0; i< discussionList.length; i++) {
let discussion = discussionList[i];                 
if (discussion._id === discussionId) {
return discussion;
}
}
};

您不能真正用forEach替换它，因为使用return关键字会出现同样的问题：

handleGetDiscussion = (discussionId) => {
const discussionList = [...this.state.discussionList];
console.log("The discussionList", discussionList);
// WILL NOT WORK:
discussionList.forEach((discussion) => { <-----------. The return                 
if (discussion._id === discussionId) {             | belongs to
return discussion;     --------------------------' this function
}
});
}

但有一种方法可以在功能上做到这一点——使用find:

handleGetDiscussion = (discussionId) => {
const discussionList = [...this.state.discussionList];
console.log("The discussionList", discussionList);
return discussionList.find((discussion) => {                 
return discussion._id === discussionId;
});
}

Answer 3

find()是查找单个匹配项(如果ID是唯一的(或多个匹配项中的第一个匹配项(如ID不是唯一的(的方法。如果id不是唯一的，并且您想查找所有匹配项，那么filter()是正确的方法。

let discussionList = [{
id: 1,
content: "discussion one"
}, {
id: 2,
content: "discussion two"
}, {
id: 3,
content: "discussion three"
}, {
id: 1,
content: "another discussion with id one"
}]
function discussionWithId(id) {
return discussionList.find(d => d.id === id)
}
function discussionsWithId(id) {
return discussionList.filter(d => d.id === id)
}
console.log(discussionWithId(2))
console.log(discussionsWithId(1))