Skip to content

1 定义函数

1.1 函数声明

Function 也称为函数语句或函数定义,是 JavaScript 中声明函数的最常见方式。

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

add是函数名,打印add会出来函数体,打印add()会执行函数体, add(2,3)会返回5

1.2 函数表达式

1.2.1 匿名函数

函数也可以通过函数表达式定义,这样的函数可以是匿名的

js
let add = function (a, b) {
  return a + b
}
let add = function (a, b) {
  return a + b
}

add = 后面的部分称为匿名函数,由于匿名函数在创建后无法访问,并且只能通过赋值给变量来访问,因此我们将把它存储在一个我们称之为 add 的变量中。

add(1,2)会返回3,打印add会打印函数体

1.2.2 命名函数

也可以提供名称允许函数引用自身

js
const factorial = function fac(n) {
  return n < 2 ? 1 : n * fac(n - 1)
}

console.log(factorial(3)) // 6
const factorial = function fac(n) {
  return n < 2 ? 1 : n * fac(n - 1)
}

console.log(factorial(3)) // 6

factorial(3)会返回6,打印factorial会打印函数体,打印fac、fac(3)会报错

1.3 箭头函数

js
() => console.log(`这是一个箭头函数的打印`)
() => console.log(`这是一个箭头函数的打印`)

由于箭头函数没有名称,如果我们要调用它,它应该存储在一个变量中,就像函数表达式一样。

js
let foo = () => console.log(`这是一个箭头函数的打印`)
foo()
let foo = () => console.log(`这是一个箭头函数的打印`)
foo()

打印foo会打印函数体,打印foo()会执行函数体返回return值

2 构造函数

js
function Person(name, age) {
  this.name = name;
  this.age = age;
  this.sayHello = function() {
    console.log("Hello, my name is " + this.name);
  };
}

const p1 = new Person("Alice", 25);
p1.sayHello(); // Hello, my name is Alice
function Person(name, age) {
  this.name = name;
  this.age = age;
  this.sayHello = function() {
    console.log("Hello, my name is " + this.name);
  };
}

const p1 = new Person("Alice", 25);
p1.sayHello(); // Hello, my name is Alice

3 对象中的函数(方法)

js
const car = {
  brand: "Toyota",
  start: function() {
    console.log(this.brand + " is starting.");
  }
};

car.start(); // Toyota is starting.

// ES6简写
const car = {
  brand: "Toyota",
  start() {
    console.log(this.brand + " is starting.");
  }
};
const car = {
  brand: "Toyota",
  start: function() {
    console.log(this.brand + " is starting.");
  }
};

car.start(); // Toyota is starting.

// ES6简写
const car = {
  brand: "Toyota",
  start() {
    console.log(this.brand + " is starting.");
  }
};

4 立即执行函数

js
(function() {
  const message = "Hello IIFE";
  console.log(message);
})();  // Hello IIFE

// 也可以写成箭头函数形式:
(() => {
  console.log("Arrow IIFE");
})();  // Arrow IIFE
(function() {
  const message = "Hello IIFE";
  console.log(message);
})();  // Hello IIFE

// 也可以写成箭头函数形式:
(() => {
  console.log("Arrow IIFE");
})();  // Arrow IIFE

回调函数