函數 · 學習講義 2019

## 一、概述函數是一段可以反復調用的代碼塊。函數還能接受輸入的參數，不同的參數會返回不同的值。 ### 1.1 函數的聲明 JavaScript 有三種聲明函數的方法。 * function 命令 `function`命令聲明的代碼區塊，就是一個函數。`function`命令后面是函數名，函數名后面是一對圓括號，里面是傳入函數的參數。函數體放在大括號里面。 ~~~ function print(s) { console.log(s); } ~~~ 上面的代碼命名了一個`print`函數，以后使用`print()`這種形式，就可以調用相應的代碼。這叫做函數的聲明（Function Declaration）。 * 函數表達式除了用`function`命令聲明函數，還可以采用變量賦值的寫法。 ~~~ var print = function(s) { console.log(s); }; ~~~ 這種寫法將一個匿名函數賦值給變量。這時，這個匿名函數又稱函數表達式（Function Expression），因為賦值語句的等號右側只能放表達式。 * Function 構造函數第三種聲明函數的方式是`Function`構造函數。 ~~~ var add = new Function( 'x', 'y', 'return x + y' ); // 等同于 function add(x, y) { return x + y; } ~~~ 上面代碼中，`Function`構造函數接受三個參數，除了最后一個參數是`add`函數的“函數體”，其他參數都是`add`函數的參數。 ### 1.2 函數的重復聲明如果同一個函數被多次聲明，后面的聲明就會覆蓋前面的聲明。 ~~~ function f() { console.log(1); } f() // 2 function f() { console.log(2); } f() // 2 ~~~ ### 1.3 圓括號運算符，return 語句和遞歸調用函數時，要使用圓括號運算符。圓括號之中，可以加入函數的參數。 ~~~ function add(x, y) { return x + y; } add(1, 1) // 2 ~~~ 函數體內部的`return`語句，表示返回。JavaScript 引擎遇到`return`語句，就直接返回`return`后面的那個表達式的值，后面即使還有語句，也不會得到執行。也就是說，`return`語句所帶的那個表達式，就是函數的返回值。`return`語句不是必需的，如果沒有的話，該函數就不返回任何值，或者說返回`undefined`。函數可以調用自身，這就是遞歸（recursion）。下面就是通過遞歸，計算斐波那契數列的代碼。 ~~~ function fib(num) { if (num === 0) return 0; if (num === 1) return 1; return fib(num - 2) + fib(num - 1); } fib(6) // 8 ~~~ 上面代碼中，`fib`函數內部又調用了`fib`，計算得到斐波那契數列的第6個元素是8。 ### 1.4 函數名的提升 JavaScript 引擎將函數名視同變量名，所以采用`function`命令聲明函數時，整個函數會像變量聲明一樣，被提升到代碼頭部。所以，下面的代碼不會報錯。 ~~~ f(); function f() {} ~~~ 表面上，上面代碼好像在聲明之前就調用了函數`f`。但是實際上，由于“變量提升”，函數`f`被提升到了代碼頭部，也就是在調用之前已經聲明了。但是，如果采用賦值語句定義函數，JavaScript 就會報錯。 ~~~ f(); var f = function (){}; // TypeError: undefined is not a function // 等價于 var f; f(); f = function () {}; ~~~ ~~~ var f = function () { console.log('1'); } function f() { console.log('2'); } f() // 1 ~~~ ## 二、函數作用域作用域（scope）指的是變量存在的范圍。在 ES5 的規范中，JavaScript 只有兩種作用域：一種是全局作用域，變量在整個程序中一直存在，所有地方都可以讀取；另一種是函數作用域，變量只在函數內部存在。 * 對于頂層函數來說，函數外部聲明的變量就是全局變量（global variable），它可以在函數內部讀取。 ~~~ var v = 1; function f() { console.log(v); } f() // 1 ~~~ 上面的代碼表明，函數`f`內部可以讀取全局變量`v`。 * 在函數內部定義的變量，外部無法讀取，稱為“局部變量”（local variable）。 ~~~ function f(){ var v = 1; } v // ReferenceError: v is not defined ~~~ 上面代碼中，變量`v`在函數內部定義，所以是一個局部變量，函數之外就無法讀取。函數內部定義的變量，會在該作用域內覆蓋同名全局變量。 ~~~ var v = 1; function f(){ var v = 2; console.log(v); } f() // 2 v // 1 ~~~ 上面代碼中，變量`v`同時在函數的外部和內部有定義。結果，在函數內部定義，局部變量`v`覆蓋了全局變量`v`。 ## 三、參數函數運行的時候，有時需要提供外部數據，不同的外部數據會得到不同的結果，這種外部數據就叫參數。 ~~~ function square(x) { return x * x; } square(2) // 4 square(3) // 9 ~~~ 上式的`x`就是`square`函數的參數。每次運行的時候，需要提供這個值，否則得不到結果。