函数 - JavaScript 教程

讲解

函数是可复用的代码块。函数声明的写法是 function 名字(参数) { ... }，函数表达式的写法是 const 名字 = function(参数) { ... }。两者最大的区别是提升：函数声明会被整体提升到作用域顶部，声明之前就能调用；函数表达式只是变量赋值，之前调用会报「未初始化」错误。现代代码里箭头函数（下一节）和函数声明并用，函数表达式较少见。

调用函数传参时，参数个数可以不匹配：多传的被忽略，少传的是 undefined。可以给参数设默认值 function greet(name = '访客')——只在传 undefined 时生效。剩余参数 ...args 把多出来的实参收集成真数组（取代老的 arguments 对象）。函数用 return 返回值，没有 return 就返回 undefined；return 后面的代码不会执行，return 单独一行时还要注意别在 return 后直接换行（会被自动插入分号）。

函数在 JavaScript 里是「一等公民」：可以赋值给变量、作为参数传给别的函数、作为返回值返回。这是整个函数式风格的基础——数组的 map、filter 接收的就是函数参数。理解「函数也是值」是学好回调、Promise 和事件处理的前提。

示例

// 函数声明会提升：声明前就能调用
console.log('提升：', add(2, 3));
function add(a, b) {
  return a + b;
}

// 默认参数与剩余参数
function greet(name = '访客', ...tags) {
  return name + '（标签：' + tags.join('、') + '）';
}
console.log(greet());
console.log(greet('小明', '前端', '教程作者'));

// 没有 return 就是 undefined
function noop() {}
console.log('无返回值：', noop());

// 函数是一等公民：作为值传递
function applyTwice(fn, x) {
  return fn(fn(x));
}
const double = (n) => n * 2;
console.log('应用两次翻倍：', applyTwice(double, 5)); // 20

// 函数作为返回值
function multiplier(factor) {
  return function (n) {
    return n * factor;
  };
}
const triple = multiplier(3);
console.log('三倍：', triple(7));

常见坑

return 后直接换行：return 换行 { ... } 会被解析成 return;（自动分号插入），返回 undefined。返回对象的左花括号要跟在 return 同行。
默认参数对 null 不生效：f(x = 1) 传 null 时 x 是 null，只有 undefined 才触发默认值。
混淆 arguments 和剩余参数：箭头函数没有 arguments；普通函数里也优先用 ...args（真数组，可直接 map）。
函数表达式提前调用：const f = function() {} 在赋值前调用 f() 会报暂时性死区错误，与函数声明的提升行为不同。

小结

函数声明会提升，表达式不会；参数支持默认值和剩余收集；函数是值，可传可返。下一节学习更简洁的箭头函数。