Javascript 函数

与大多数语言一样，Javascript 中的函数是一种执行非常具体的事情的方法，您可以在代码中多次运行该函数。函数对于您一遍又一遍地重用的代码片段很有用。在函数中，我们有不同的范围。因此，我们还将在本教程中介绍范围。

功能#

假设你正在编写一个程序，并且想要不断地将 5 加到一个特定的数字上，如果该数字超过 200，则将其乘以 Pi。函数使我们能够做到这一点，然后轻松地一次又一次地运行它。如果我们想写那个函数，我们会做这样的事情：

// Call our function addFiveThenPi, and give it a number variable.
function addFiveThenPi(number) {
    // Add 5 to the number
    let newNumber = number + 5;
    // If newNumber is more than 200, then multiply it by PI.
    if(newNumber > 200) {
        newNumber *= Math.PI;
    }
    // The output of this function is newNumber, so we return it.
    return newNumber;
}

要定义一个函数，我们可以使用关键字function，后跟函数名和圆括号，即function addFiveThenPi()。在圆括号内，我们可以定义可以在调用函数时定义的变量。在大括号内{}，我们有函数在调用时将执行的实际指令集。

有时一个函数有一个返回值，我们使用return关键字来定义它。如果您不添加return到您的函数，Javascript 将undefined默认返回该函数。上面的函数返回 的值newNumber。这意味着，在运行该函数之后，我们将得到一个输出，无论其后的值return是什么。让我们尝试运行我们的函数。那么控制台记录它的值，所以我们可以看到它：

试试看！

function addFiveThenPi(number) {
    // Add 5 to the number
    let newNumber = number + 5;
    // If newNumber is more than 200, then multiply it by PI.
    if(newNumber > 200) {
        newNumber *= Math.PI;
    }
    // The output of this function is newNumber, so we return it.
    return newNumber;
}
let calculateVariable = addFiveThenPi(5);
console.log(calculateVariable);

通过这个，上面将取数字 5 并添加 5（即10） – 由于这小于 200，我们不会将它乘以 Pi。我们可以多次调用这个函数。函数是可重用的，所以我们可以多次调用它们并获得多个不同的返回值：

let example1 = addFiveThenPi(5);
let example2 = addFiveThenPi(100);
let example3 = addFiveThenPi(200);

这使我们可以灵活地多次运行一组复杂的指令。由于我们的函数返回一个值，我们几乎可以在任何地方使用它——例如，直接在 if 语句中：

if(addFiveThenPi(10) < 1000) {
    console.log('Well done!');
}

变量函数#

Javascript 有几种不同的方法来编写函数。一种方法是以存储函数的变量的形式编写它。这些仍然可以以与普通函数完全相同的方式调用：

const myFunction = function(number) {
    // Contents of the function goes here
}

匿名函数#

Javascript 还为我们提供了定义没有名称的变量的选项。然后这些功能只能运行一次。在下面的示例中，我们将5作为number的值传递：

(function(number) {
    // Content of the function goes here
})(5);

箭头符号函数#

箭头符号让我们无需使用 function 关键字即可创建函数。

const myFunction = (number) => {
    // Function goes here
}

箭头函数没有thisor super，所以当你this在它们内部调用时，你会得到this它父级的。

同样，如果箭头函数中只有一行，则变量不需要括号，并且箭头后面的部分会自动返回，即返回number * 10：

const myFunction = number => number * 10;

同样，以下是有效的：

const myFunction = (x, y) => x * y;

函数内的范围#

范围是我们如何根据我们编写它们的位置来确定某些变量是否可以被引用。函数有一个封闭的范围，这意味着它们内部的东西不能在它们之外使用。例如：

let myFunction = function() {
    let number = 2;
}

在上面的代码中，number不能在 myFunction 之外调用。如果您尝试，它将是未定义的。但是，在下面的示例中，由于 number 是在函数外部声明的，因此可以在函数内部和外部调用它：

let number = 2;

let myFunction = function() {
    // We could use "number" here
}

// And we can also use "number" here

因此，全局中的任何内容，即在顶层，在任何函数或条件语句之外，都可以在函数和条件语句中被引用和调用。