return 返回值
上一课把值送进函数。真实程序往往还需要一个向外的结果——合计、标签、是/否——好让调用方继续用这个结果。把结果送回去的关键字就是 return。
return 做什么
在函数体里写 return expression;。JavaScript 计算表达式,把值交给调用方,并结束这次调用。调用方可以保存:let total = add(3, 4);——这里 total 变成 7。
return 不等于打印
📊 return 与 console.log
| 概念 | 做什么 | 谁看见 |
|---|---|---|
return value |
把 value 送给调用方 |
你的下一行代码 |
console.log(value) |
在控制台打印 value |
看控制台的人 |
| 两者 | 可以既打印又返回 | 打印给人看;return 给程序用 |
没有 return |
调用以 undefined 结束 |
保存调用会得到 undefined |
return 之后 |
这次调用的后续行被跳过 | 提前退出是有意的 |
打印方便偷看。返回让程序其余部分使用答案。初学者常只在函数里打印,却奇怪为什么 let x = f() 是 undefined——因为什么都没返回。
function add(a, b) {
return a + b;
}
let total = add(3, 4);
console.log(total);
接住结果
add 自己并不打印。它返回 7。调用方把它存进 total,再打印。改实参、保留函数体——返回的和随输入变化。
function greet(name) {
return "Hello, " + name;
}
let line = greet("Sara");
console.log(line);
先造一个以后能用的值
greet 拼出字符串并交出去。line 里是 Hello, Sara。你可以把 line 交给页面、另一个函数或测试——return 打开了函数体外的复用。
function demo() {
console.log("first");
return 1;
console.log("second");
}
demo();
return 后面的代码不会跑
这次调用先打印 first,再返回 1。本该打印 second 的那一行永远不会执行。这不是 bug——return 立刻结束调用。
function label(score) {
if (score < 0) {
return "invalid";
}
return "ok";
}
console.log(label(-1));
console.log(label(10));
答案已定时提前离开
若 score 为负,函数返回 "invalid" 并跳过其余部分;否则返回 "ok"。这种提前 return 让正常路径又短又清晰。
function shout(msg) {
console.log(msg);
}
let result = shout("hi");
console.log(result);
忘了 return?
shout 只打印。调用仍会结束,但是带着 undefined。保存这次调用会把 undefined 放进 result。外面需要值时,请写明确的 return。
把返回值放到页面上
用 return 造出消息,再把该字符串写进段落。函数专心产出文本;页面代码决定显示在哪里。
在页面上展示 return
声明一个返回欢迎字符串的函数,调用它,并把结果放进段落。
<!DOCTYPE html>
<html>
<head>
<title>return — page</title>
</head>
<body>
<p id="msg">…</p>
<script>
function welcome(guest) {
return "Hello, " + guest;
}
let box = document.getElementById("msg");
box.textContent = welcome("Omar");
</script>
</body>
</html>
页面显示 Hello, Omar。welcome 返回了字符串;下一行把它写进段落。只改实参、刷新,再读新行。下一课是箭头函数——写这类函数的一种更短写法。
自己试试
- 写
function sum(x, y),返回x + y,把调用存进变量并打印该变量。 - 写
function hi(name),返回"hi "加上name,再打印返回的字符串。 - 在函数里于
return之后放一个console.log;确认那一行不会打印。 - 写守卫:若
n === 0返回"zero",否则返回"nonzero"。 - 调用一个只做
console.log的函数并保存调用;确认得到undefined。 - 在 HTML 演示里只改实参字符串,刷新并阅读段落。
常见错误
- 函数里只用
console.log,却指望let x = f()能拿到有用值 - 在调用处忘记保存或使用返回值
- 在
return之后写代码,却奇怪为何不执行 - 写成空的
return;,其实想要return value; - 在这里找参数技巧——本页讲的是输出;输入是上一课
小结
return把值送给调用方- 在函数外保存或使用该值
return之后,本次调用的其余部分被跳过- 提前 return 是处理特例的干净出口
- 没有
return(或空return)→ 调用得到undefined - 页面更新可以使用返回的字符串
- 下一课:箭头函数——紧凑的函数写法
🧠 测试您的知识
测试您的知识
通过这个互动测验挑战自己,看看你对这个主题的理解程度如何
📝 说明
- 仔细阅读每个问题
- 为每个问题选择最佳答案
- 您可以随时重新参加测验
- 您的进度将显示在顶部