函数是编程的“动词”。它们允许你打包一组指令,给它一个名字,并在你想用的任何时候重用它。
输入-输出机器
把函数想象成一台 面包机。
1. 输入 (参数): 你放入面包。
2. 逻辑 (主体): 线圈加热并烘烤面包。
3. 输出 (返回): 它弹出烤面包。
你不需要知道内部线路如何工作就能使用它。你只需要按下按钮。
1. 定义函数
编写函数并不会运行它。它只是“教”电脑如何做这项任务。
javascript
// 1. 定义 (教学)
function makeSandwich(filling) {
// 'filling' 是一个只在这里存在的变量
return "这是你的 " + filling + " 三明治!";
}
// 2. 调用 (使用)
const lunch = makeSandwich("火鸡");
console.log(lunch);
const dinner = makeSandwich("花生酱和果酱");
console.log(dinner);"Return" 的困惑
初学者经常混淆 console.log 和 return。
- console.log: 就像打印照片。你可以看到它,但不能在代码中使用它。
- return: 就像给你照片文件。你可以保存、编辑或发送给其他人。
javascript
function addWithLog(a, b) {
console.log(a + b); // 只是打印
}
function addWithReturn(a, b) {
return a + b; // 返回值
}
const result1 = addWithLog(2, 2);
console.log("结果 1 是:", result1); // Undefined!
const result2 = addWithReturn(2, 2);
console.log("结果 2 是:", result2); // 4 (成功了!)广告
查看赞助商以支持 JS Fruggal。
现代箭头函数
在现代 JavaScript (ES6) 中,我们更喜欢更清晰的语法。它的行为大部分相同,但看起来更犀利。
javascript
// 旧方式
function oldSum(a, b) {
return a + b;
}
// 现代方式
// 如果是一行,你甚至不需要 'return' 或大括号!
const newSum = (a, b) => a + b;
console.log(newSum(10, 50));默认参数
如果有人调用你的函数但忘记了配料怎么办?你可以设置默认值。
javascript
const greet = (name = "陌生人") => {
console.log("你好," + name);
};
greet("Alice"); // 你好,Alice
greet(); // 你好,陌生人 (使用备用值)