JavaScript函數的4種呼叫方法詳解_javascript技巧

在JavaScript中，函數是一等公民，函數在JavaScript中是一個資料類型，而非像C#或其他描述性語言那樣僅僅作為一個模組來使用。函數有四種呼叫模式，分別是：函數呼叫形式、方法呼叫形式、建構器形式、以及apply形式。這裡所有的呼叫模式中，最主要的差異在於關鍵字 this 的意義，以下分別介紹這個幾種呼叫形式。

本文主要內容：

1.分析函數的四種呼叫形式
2.弄清楚函數中this的意義
3.明確建構函物件的過程
4.學會使用上下文呼叫函數

一、函數呼叫形式

函數呼叫形式是最常見的形式，也是最好理解的形式。所謂函數形式就是一般宣告函數後直接呼叫即是。例如：

    alert("Hello World");
}
func(); 程式碼如下:

// 使用函數的Lambda表達式定義函數，然後呼叫
var func = function() {

程式碼如下:

var func = function() {

var func = function() {
alert(this);

// 定義一個函數o.fn();// 修改函數體
var func = function() {    alert(this);

};

var o = {};

o.fn = func;var o = {};o.fn = func;

// 比較

alert(o.fn === func);
// 呼叫

三、構造器呼叫模式 同樣是函數，在單純的函數模式下，this 表示 window；在物件方法模式下，this 指的是目前物件。除了這兩種情況，JavaScript 中函數還可以是建構器。將函數當作建構器來使用的語法就是在函式呼叫前面加上一個 new 關鍵字。如程式碼：複製程式碼 程式碼如下:p.sayHello();
上面的案例先建立一個建構函式Person，然後再使用建構子建立物件p。這裡使用 new 語法。然後在使用物件呼叫sayHello()方法，這個使用建構函式創建物件的案例比較簡單。從案例可以看到，此時 this 指的是物件本身。除了上面簡單的使用以外，函數作為建構器還有幾個變化，分別為：

1、所有需要物件使用的屬性，必須使用 this 引導；

2、函數的 return 語句意義被改寫，如果傳回非對象，就回傳this。

構造器中的 this

我們需要分析創建物件的過程，方能知道 this 的意義。如下面程式碼：

程式碼如下:
這裡先定義了函數Person，以下分析整個執行：

1、程式在執行到這句話的時候，不會執行函數體，因此 JavaScript 的解釋器並不知道這個函數的內容。

2、接下來執行 new 關鍵字，創建對象，解釋器開闢內存，得到對象的引用，將新對象的引用交給函數。

3、緊接著執行函數，將傳過來的物件參考交給 this。也就是說，在建構方法中，this 就是剛被 new 建立出來的物件。

4、然後為 this 新增成員，也就是為物件新增成員。

5、最後函數結束，回傳 this，將 this 交給左邊的變數。

分析過建構子的執行以後，可以得到，建構子中的 this 就是目前物件。

構造器中的 return

在建構函式中 return 的意義發生了變化，首先如果在建構函式中，如果傳回的是一個對象，那麼就保留原意。如果傳回的是非對象，例如數字、布林和字串，那就回傳this，如果沒有return 語句，那麼也回傳this，看下面程式碼：

// 定義傳回非物件資料的建構器代碼運行結果是，先彈窗打印[object Object]，然後打印”趙曉虎”，因為這裡return 的是一個字符串，屬於基本類型，那麼這裡的return 語句無效，返回的是this 對象，因此第一個印製的是[object Object]而第二個不會印出undefined。

四、apply呼叫模式

除了上述三種呼叫模式以外，函數作為物件還有 apply 方法與 call 方法可以使用，這便是第四種呼叫模式，我稱之為 apply 模式。

先介紹 apply 模式，首先這裡 apply 模式既可以像函數一樣使用，也可以像方法一樣使用，可以說是一個靈活的使用方法。首先來看語法：函數名稱.apply(物件, 參數陣列);

這裡看文法比較晦澀，還是使用案例來說明：

1、新建兩個 js 文件，分別為”js1.js”與”js2.js”;

2、新增程式碼