为什么过滤方法不能正常工作？

Question

我正在尝试将得分为 80 或更高的学生的姓名保存在一个变量中，但我无法使用过滤器完成此操作，它返回整个对象，尽管我指定我希望它打印只有这些对象的键值，也就是这些学生的名字。

我的代码：

// Students names/scores
let students = [
    {name: "Ahmed" , score: 84},
    {name: "Samira" , score: 69},
    {name: "Dana" , score: 75},
    {name: "Basil" , score: 100},
    {name: "Fahad" , score: 91},
    {name: "Aljawhara" , score: 80},
    {name: "Fadi" , score: 70},
]


// Students who scored 80 or more using filter
let studentsScoredMoreThan80 = students.filter((item,index,array) => {
    if(item.score >= 80) return item.name;
})
console.log(studentsScoredMoreThan80);

这是它打印的内容：

我如何只获得得分在 80 分或以上的学生的姓名？

Answer 1

过滤器从数组中删除元素 从数组开始，根据条件仅保留其中的一些元素，并返回一个新数组，而原始数组保持不变。它什么也不做。它期望 true 或 false 作为返回值（表示保留或丢弃），但您返回的是 item.name（这是真的，所以它像 true 一样工作）。

然后您需要使用 map 将完整的 student 对象转换为字符串（他们的名字）：

let students = [
    {name: "Ahmed" , score: 84},
    {name: "Samira" , score: 69},
    {name: "Dana" , score: 75},
    {name: "Basil" , score: 100},
    {name: "Fahad" , score: 91},
    {name: "Aljawhara" , score: 80},
    {name: "Fadi" , score: 70},
]


// Students who scored 80 or more using filter
let studentsScoredMoreThan80 = students
                                  .filter(student => student.score > 80)
                                  .map( student => student.name);

console.log(studentsScoredMoreThan80)

Answer 2

'Array.filter'中'callback'的返回值转换为'Boolean'，如果'item.score >= 80'返回字符串并转换为'true'，否则返回'undefined'并转换为'false'，如果你只想student.name，使用Array.map(callback)

Answer 3

Filter 只是过滤列表，它不会将列表项投影到新结构中。

您正在寻找的是filter 和 map 的组合。首先过滤您的列表：

let studentsScoredMoreThan80 = students.filter(item => item.score >= 80);

然后将结果映射到你想要的新结构：

studentsScoredMoreThan80 = studentsScoredMoreThan80.map(item => item.name);