本文详解为何调用 console.log(showContent(student)) 会导致控制台末尾多出 undefined，并说明 forEach 的执行机制与函数返回值的关系。
本文详解为何调用 `console.log(showcontent(student))` 会导致控制台末尾多出 `undefined`，并说明 `foreach` 的执行机制与函数返回值的关系。
在 JavaScript 中，forEach() 是一个仅用于遍历、不返回任何值（即隐式返回 undefined） 的数组方法。它专注于执行副作用（如 console.log），而非构建新数组或产生结果。因此，当你编写如下代码：
function showContent(obj) {
obj.grades.forEach(function(grade) {
console.log(grade);
});
}
该函数内部确实会逐个打印 15、18、14、17 —— 这是 forEach 回调执行的正常效果。但请注意：showContent 函数本身没有 return 语句，所以它的返回值默认为 undefined。
而问题代码的最后一行：
console.log(showContent(student));
实际做了两件事：
- 先执行
showContent(student)→ 触发四次console.log(grade)，输出四行数字； - 再将
showContent(student)的返回值（即undefined）传给外层console.log→ 输出第五行undefined。
✅ 正确写法是直接调用函数，无需包裹在 console.log() 中：
showContent(student); // ✅ 仅执行，不打印返回值
⚠️ 注意事项：
-
forEach不可链式调用（因返回undefined），如需转换或筛选，请改用map()、filter()等有返回值的方法； - 若需同时打印内容并返回处理结果，应显式
return（例如返回处理后的数组），此时已不属于forEach的适用场景； - 调试时可通过
console.log(typeof showContent(student))验证返回类型，确认是否为"undefined"。
总结：undefined 并非来自 forEach 或数据本身，而是你误将一个无返回值函数的调用结果再次 console.log 所致。掌握函数返回行为，是避免此类“幽灵输出”的关键。
