JavaScript学习-第六天

2025-09-29
JavaScript笔记

函数

函数的声明

function 命令

function命令声明的代码区块,就是一个函数。function命令后面是函数名,函数名后面是一对圆括号,里面是传入函数的参数。函数体放在大括号里面。

function print(s){
  console.log(s);
}

函数表达式

函数表达式是指将一个函数赋值给一个变量。

var print = function(s){
  console.log(s);
}

这种写法将一个匿名函数赋值给变量。这时,这个匿名函数又称函数表达式(Function Expression),因为赋值语句的等号右侧只能放表达式。


采用函数表达式声明函数时,function命令后面不带有函数名。如果加上函数名,该函数名只在函数体内部有效,在函数体外部无效。

var print = function x(){
  console.log(typeof x);
};

x
// ReferenceError: x is not defined

print()
// function

上面代码在函数表达式中,加入了函数名x。这个x只在函数体内部可用,指代函数表达式本身,其他地方都不可用。这种写法的用处有两个,一是可以在函数体内部调用自身,二是方便除错(除错工具显示函数调用栈时,将显示函数名,而不再显示这里是一个匿名函数)。因此,下面的形式声明函数也非常常见。

函数的重复声明

如果同一个函数被多次声明,后面的声明就会覆盖前面的声明。

function print(s){
  console.log(s);
}

print('hello')
// hello

function print(s){
  console.log(s.toUpperCase());
}

print('hello')
// HELLO

圆括号运算符,return 语句和递归

圆括号运算符用于调用函数。

print('hello')
// hello

return语句用于返回函数值。

function add(a, b){
  return a + b;
}

递归是指函数调用自身的行为。

function factorial(n){
  if (n === 1) return 1;
  return n * factorial(n - 1);
}

第一等公民

函数与其他数据类型一样,处于平等地位,可以赋值给其他变量,也可以作为参数,传入另一个函数,或者作为别的函数的返回值。

函数名的提升

函数声明会提升到代码头部,这意味着,你可以在函数声明之前调用该函数。

函数的属性和方法

name 属性

函数的name属性返回函数的函数名。

function print(s){
  console.log(s);
}

length 属性

函数的length属性返回函数预期传入的参数个数,即函数定义之中的参数个数。

function print(s){
  console.log(s);
}

toString() 方法

函数的toString()方法返回一个字符串,内容是函数的源码。

function print(s){
  console.log(s);
}

函数本身的作用域

函数本身也是一个值,也有自己的作用域。它的作用域与变量一样,就是其声明时所在的作用域,与其运行时所在的作用域无关。

var a = 1;
var x = function () {
  console.log(a);
};

function f() {
  var a = 2;
  x();
}

f() // 1

上面代码中,函数x是在函数f的外部声明的,所以它的作用域绑定外层,内部变量a不会到函数f体内取值,所以输出1,而不是2。


总之,函数执行时所在的作用域,是定义时的作用域,而不是调用时所在的作用域。


很容易犯错的一点是,如果函数A调用函数B,却没考虑到函数B不会引用函数A的内部变量。

var x = function () {
  console.log(a);
};

function y(f) {
  var a = 2;
  f();
}

y(x)
// ReferenceError: a is not defined

上面代码将函数x作为参数,传入函数y。但是,函数x是在函数y体外声明的,作用域绑定外层,因此找不到函数y的内部变量a,导致报错。


同样的,函数体内部声明的函数,作用域绑定函数体内部。

function foo() {
  var x = 1;
  function bar() {
    console.log(x);
  }
  return bar;
}

var x = 2;
var f = foo();
f() // 1

上面代码中,函数foo内部声明了一个函数bar,bar的作用域绑定foo。当我们在foo外部取出bar执行时,变量x指向的是foo内部的x,而不是foo外部的x。正是这种机制,构成了下文要讲解的“闭包”现象。

函数的参数

函数的参数是函数定义时指定的,参数可以是任意类型的变量。

function functionName(parameter1, parameter2) {
  // 函数体
}

传递方式

函数参数如果是原始类型的值(数值、字符串、布尔值),传递方式是传值传递(passes by value)。这意味着,在函数体内修改参数值,不会影响到函数外部。

var p = 2;

function f(p) {
  p = 3;
}
f(p);

p // 2

上面代码中,变量p是一个原始类型的值,传入函数f的方式是传值传递。因此,在函数内部,p的值是原始值的拷贝,无论怎么修改,都不会影响到原始值。


但是,如果函数参数是复合类型的值(数组、对象、其他函数),传递方式是传址传递(pass by reference)。也就是说,传入函数的原始值的地址,因此在函数内部修改参数,将会影响到原始值。

var obj = { p: 1 };

function f(o) {
  o.p = 2;
}
f(obj);

obj.p // 2

上面代码中,传入函数f的是参数对象obj的地址。因此,在函数内部修改obj的属性p,会影响到原始值。


注意,如果函数内部修改的,不是参数对象的某个属性,而是替换掉整个参数,这时不会影响到原始值。

var obj = [1, 2, 3];

function f(o) {
  o = [2, 3, 4];
}
f(obj);

obj // [1, 2, 3]

上面代码中,在函数f()内部,参数对象obj被整个替换成另一个值。这时不会影响到原始值。这是因为,形式参数(o)的值实际是参数obj的地址,重新对o赋值导致o指向另一个地址,保存在原地址上的值当然不受影响。

同名参数

如果有多个同名参数,则取最后出现的那个参数。

function f(a, a) {
  console.log(a);
}

f(1, 2) // 2