JavaScript函数|极客笔记

JavaScript函数

1. 引言

JavaScript（简称JS）是一种高级的、解释型的编程语言。它广泛用于网页开发，可用于为网页添加各种交互效果，改变网页内容、样式或行为。在JavaScript中，函数是一个非常重要的概念，它允许我们将可重复使用的代码块封装起来，以便在需要时进行调用。本文将详细介绍JavaScript函数的定义、调用、参数、返回值以及作用域等相关知识。

2. 函数定义和调用

在JavaScript中，我们可以使用function关键字来定义一个函数。函数名后面跟着一对圆括号，可以在括号内指定函数的参数。函数体由一对花括号包裹，里面包含函数需要执行的代码。

下面是一个简单的示例，演示了如何定义并调用一个函数：

// 定义函数
function sayHello() {
  console.log("Hello, World!");
}

// 调用函数
sayHello(); // 输出：Hello, World!

在上面的代码中，我们定义了一个名为sayHello的函数，函数体中的代码会在函数被调用时执行。通过调用sayHello()，我们可以在控制台输出Hello, World!。

3. 函数参数

函数可以接受零个或多个参数。在函数定义中，我们可以在圆括号内指定函数的参数，并在函数体内使用这些参数。

以下示例展示了一个带有参数的函数，它可以接受两个数字作为参数，并计算它们的和：

// 定义带有参数的函数
function add(num1, num2) {
  let sum = num1 + num2;
  console.log("Sum: " + sum);
}

// 调用函数并传入参数
add(5, 3); // 输出：Sum: 8

在上面的代码中，我们定义了一个名为add的函数，它接受两个参数num1和num2。在函数体内，我们使用这些参数计算它们的和，并将结果输出到控制台。通过调用add(5, 3)，我们将数字5和3作为参数传递给函数，并得到结果8。

4. 函数返回值

JavaScript函数还可以返回一个值。在函数体内，我们可以使用return语句返回一个值，并将其传递给函数调用者。

以下示例展示了一个带有返回值的函数，它接受两个数字作为参数，并返回它们的和：

// 定义带有返回值的函数
function add(num1, num2) {
  let sum = num1 + num2;
  return sum;
}

// 调用函数并获取返回值
let result = add(5, 3);
console.log("Result: " + result); // 输出：Result: 8

在上面的代码中，我们定义了一个名为add的函数，它接受两个参数num1和num2，并返回它们的和。我们将函数的返回值存储在变量result中，并将其输出到控制台。

5. 函数作用域

JavaScript中的函数具有自己的作用域。这意味着在函数内部定义的变量只能在函数内部访问，无法从函数外部访问。

以下示例展示了函数作用域的特性：

// 全局变量
let globalVariable = "Global";

// 函数内部定义的变量
function printLocalVariable() {
  let localVariable = "Local";
  console.log(localVariable); // 输出：Local
  console.log(globalVariable); // 输出：Global
}

// 尝试访问函数内部的变量
console.log(localVariable); // 报错：localVariable is not defined
console.log(globalVariable); // 输出：Global

// 调用函数
printLocalVariable();

在上面的代码中，我们定义了一个全局变量globalVariable和一个函数printLocalVariable。在函数内部，我们定义了一个局部变量localVariable。在函数外部，我们无法访问函数内部的局部变量，但可以访问全局变量。

6. 匿名函数

除了使用function关键字定义函数外，JavaScript还支持匿名函数。匿名函数是没有函数名的函数，常用于作为其他函数的参数或立即执行函数。

以下示例展示了一个使用匿名函数作为参数的示例：

// 定义接受回调函数作为参数的函数
function doSomething(callback) {
  console.log("Doing something...");
  callback(); // 调用回调函数
}

// 使用匿名函数作为回调函数
doSomething(function() {
  console.log("Callback function called.");
});

在上面的代码中，我们定义了一个名为doSomething的函数，它接受一个回调函数作为参数，并在函数内部调用它。我们使用匿名函数作为回调函数，并在其中输出一条信息。