JavaScript function函數種類

本文轉載於：http://www.javashuo.com/article/p-xatrbtzi-y.html

本篇主要介紹普通函數、匿名函數、閉包函數

目錄

1. 普通函數：介紹普通函數的特性：同名覆蓋、arguments對象、默認返回值等。

2. 匿名函數：介紹匿名函數的特性：變量匿名函數、無名稱匿名函數。

3. 閉包函數：介紹閉包函數的特性。

 

1. 普通函數

1.1 示例

1 2 3

function  ShowName(name) {      alert(name); }

 

1.2 Js中同名函數的覆蓋

在Js中函數是沒有重載，定義相同函數名、不一樣參數簽名的函數，後面的函數會覆蓋前面的函數。調用時，只會調用後面的函數。

1 2 3 4 5 6 7 8 9 10 11

var  n1 = 1;   function  add(value1) {      return  n1 + 1;  } alert(add(n1)); //調用的是下面的函數，輸出：3   function  add(value1, value2) {      return  value1 + 2; } alert(add(n1)); //輸出：3

 

1.3 arguments對象

arguments 相似於C#的params，操做可變參數：傳入函數的參數數量大於定義時的參數數量。

1 2 3 4 5 6 7

function  showNames(name) {      alert(name); //張三      for  ( var  i = 0; i < arguments.length; i++) {          alert(arguments[i]); //張3、李4、王五      } } showNames( '張三' , '李四' , '王五' );

 

1.4 函數的默認返回值

若函數沒有指明返回值，默認返回的是'undefined'

1 2 3

function  showMsg() { } alert(showMsg()); //輸出：undefined

　　

2.匿名函數

2.1 變量匿名函數

2.1.1 說明

能夠把函數賦值給變量、事件。

2.1.2 示例

1 2 3 4 5

//變量匿名函數，左側能夠爲變量、事件等 var  anonymousNormal =  function  (p1, p2) {       alert(p1+p2); } anonymousNormal(3,6); //輸出9

2.1.3 適用場景

①避免函數名污染。若先聲明個帶名稱的函數，再賦值給變量或事件，就形成了函數名的濫用。

 

2.2 無名稱匿名函數

2.2.1 說明

即在函數聲明時，在後面緊跟參數。Js語法解析此函數時，裏面代碼當即執行。

2.2.2 示例

1 2 3

( function  (p1) {      alert(p1); })(1);

2.2.3 適用場景

①只需執行一次的。如瀏覽器加載完，只須要執行一次且後面不執行的功能。

 

3. 閉包函數

3.1 說明

 假設，函數A內部聲明瞭個函數B，函數B引用了函數B以外的變量，而且函數A的返回值爲函數B的引用。那麼函數B就是閉包函數。

 

3.2 示例

3.2.1 示例1：全局引用與局部引用

1 2 3 4 5 6 7 8 9 10 11 12 13 14

function  funA() {      var  i = 0;      function  funB() {  //閉包函數funB          i++;          alert(i)      }      return  funB; } var  allShowA = funA();  //全局變量引用：累加輸出1,2,3,4等   function  partShowA() {      var  showa = funA(); //局部變量引用：只輸出1      showa(); }

allShowA是個全局變量，引用了函數funA。重複運行allShowA()，會輸出1,2,3,4等累加的值。

執行函數partShowA(),由於內部只聲明瞭局部變量showa來引用funA，執行完畢後因做用域的關係，釋放showa佔用的資源。

閉包的關鍵就在於做用域：全局變量佔有的資源只有當頁面變換或瀏覽器關閉後纔會釋放。var allShowA = funA() 時，至關於allShowA引用了funB()，從而使funB()裏的資源不被GC回收，所以funA()裏的資源也不會。

 

3.2.2 示例2：有參閉包函數

1 2 3 4 5 6 7 8 9 10 11

function  funA(arg1,arg2) {      var  i = 0;      function  funB(step) {          i = i + step;          alert(i)      }      return  funB; } var  allShowA = funA(2, 3);  //調用的是funA arg1=2，arg2=3 allShowA(1); //調用的是funB step=1,輸出 1 allShowA(3); //調用的是funB setp=3,輸出 4

 

3.2.3 示例3：父函數funA內的變量共享

1 2 3 4 5 6 7 8 9 10 11 12 13 14

function  funA() {      var  i = 0;     function  funB() {          i++;          alert(i)      }      allShowC =  function  () { // allShowC引用匿名函數,與funB共享變量i          i++;          alert(i)      }      return  funB; } var  allShowA = funA();  var  allShowB = funA(); //allShowB引用了funA，allShowC在內部從新進行了綁定，與allShowB共享變量i

 

3.3 適用場景

①保證函數funA內裏的變量安全，由於外部不能直接訪問funA的變量。

 

End