函数声明和函数表达式 — javascript函数详解（一）

JavaScript 函数

JavaScript 函数是一段代码块，它由函数声明或函数表达式定义，可以在需要时被调用。函数可以接受参数，并返回一个值。函数在 JavaScript 中非常重要，它是构建复杂程序的基础。

函数声明

函数声明是使用 function 定义函数的传统方式。函数声明必须以 function 关键字开头，后面跟着函数名和一对括号。括号内可以放参数，参数用逗号分隔。函数体的代码块放在一对花括号 {} 内。

function sayHello() {
  console.log("Hello, world!");
}

sayHello(); // 输出: "Hello, world!"

函数表达式

函数表达式是使用一个变量来定义函数的现代方式。函数表达式与函数声明类似，但它没有函数名，而且它必须被分配给一个变量。

const greet = function () {
  console.log("Hello, world!");
};

greet(); // 输出: "Hello, world!"

构造函数 Function

构造函数 Function 可以用来创建新的函数。Function 构造函数接受两个参数：参数列表和函数体。参数列表和函数体的写法与函数声明和函数表达式相同。

const greet = new Function("name", "console.log(`Hello, ${name}!`)");

greet("John"); // 输出: "Hello, John!"

箭头函数

箭头函数是 ES6 中引入的一种新的函数语法。箭头函数使用 => 符号来定义函数。箭头函数的函数体可以是一个代码块，也可以是一个表达式。

const greet = (name) => console.log(`Hello, ${name}!`);

greet("John"); // 输出: "Hello, John!"

除了 Function 构造函数 new 出来的函数名是 annoymous，其他方法定义的函数，首先看关键字 function 后面的函数名，如果没有 function function 的关键字，那么这个函数没有函数名，是匿名函数；或者看关键字 function 后面有没有括号，如果没有括号，说明这个函数也是匿名函数。

函数调用

函数调用是通过使用函数名后面跟着一对括号来实现的。括号内可以放参数，参数用逗号分隔。

function sayHello(name) {
  console.log(`Hello, ${name}!`);
}

sayHello("John"); // 输出: "Hello, John!"

函数参数

函数参数是函数定义的一部分，它允许函数接收输入。函数参数放在函数括号内，用逗号分隔。

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

console.log(sum(1, 2)); // 输出: 3

函数返回值

函数返回值是函数执行后返回的值。函数返回值放在 return 语句后面。

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

console.log(sum(1, 2)); // 输出: 3

立即执行函数

立即执行函数（IIFE）是通过在函数定义后面加上一对圆括号来创建的。IIFE 在定义后立即执行，因此不需要调用它。

(function () {
  console.log("Hello, world!");
})(); // 输出: "Hello, world!"

函数块

函数块是函数体内的代码块。函数块用一对花括号 {} 包围。

function sayHello() {
  {
    console.log("Hello, world!");
  }
}

sayHello(); // 输出: "Hello, world!"

结论

函数是 JavaScript 中的基本构建块，由函数声明和函数表达式定义。本文介绍了 JavaScript 函数的定义、调用、参数和返回值，以及立即执行函数和函数块等内容，帮助您更好地理解和使用 JavaScript 函数。