第196天：js---調用函數的五種方式

一、普通方式

1 /*普通模式*/
2 
3     // 聲明一個函數，并調用
4     function func() {
5         console.log("Hello World");
6     }
7     func();      

二、函數表達式

1 /*函數表達式*/
 2     // 使用函數的Lambda表達式定義函數，然後調用
 3     var func = function() {
 4         console.log("你好，百度一下");
 5     };
 6     func();
 7 
 8     //可以發現函數調用很簡單，就是平時學習的一樣.
 9     //這裡的關鍵是，在函數調用模式中，函數裡的 this 關鍵字指全局對象，
10     //如果在浏覽器中就是 window 對象. 例如：
11     var func = function() {
12         console.log(this);
13     };
14     func();
15     //    此時，會彈出對話框，列印出 [object Window]      

三、方法調用模式

1 /*方法調用模式*/
 2     //函數調用模式很簡單，是最基本的調用方式.
 3     //但是同樣的是函數，将其指派給一個對象的成員以後，就不一樣了.
 4     //将函數指派給對象的成員後，那麼這個就不在稱為函數，而應該叫做方法.
 5 
 6     // 定義一個函數
 7     var func = function() {
 8         alert("我是一個函數麼?");
 9     };
10 
11     // 将其指派給一個對象
12     var o = {};
13     o.fn = func; // 注意這裡不要加圓括号
14     // 調用
15     o.fn();
16 
17     //此時，o.fn 則是方法，不是函數了.
18     //實際上 fn 的方法體與 func 是一模一樣的，但是這裡有個微妙的不同. 看下面的代碼：
19     // 接上面的代碼
20     alert(o.fn === func);
21     //列印結果是 true ，這個表明兩個函數是一樣的東西. 但是修改一下函數的代碼：
22 
23     // 修改函數體
24     var func = function() {
25         alert(this);
26     };
27     var o = {};
28     o.fn = func;
29     // 比較
30     alert(o.fn === func);
31     // 調用
32     func();
33     o.fn();
34     // 這裡的運作結果是，兩個函數是相同的，是以列印結果是 true.
35     // 但是由于兩個函數的調用是不一樣的，
36     // func的調用，列印的是 [object Window]，而o.fn 的列印結果是[object Object].
37     // 這裡便是函數調用與方法調用的差別.
38     // 函數調用中，this專指全局對象window，
39     // 而在方法中this專指目前對象. 即o.fn 中的this 指的就是對象o.      

四、構造函數調用模式

1 /*構造函數調用模式*/
 2 
 3     // 同樣是函數，在單純的函數模式下，this表示window；
 4     // 在對象方法模式下，this指的是目前對象.
 5     // 除了這兩種情況，JavaScript中函數還可以是構造器.
 6     // 将函數作為構造器來使用的文法就是在函數調用前面加上一個new關鍵字. 如代碼：
 7     // 定義一個構造函數
 8     var Person = function() {
 9         this.name = "百度一下";
10         this.sayHello = function() {
11             alert("你好，這裡是" + this.name);
12         };
13     };
14     // 調用構造器，建立對象
15     var p = new Person();
16     // 使用對象
17     p.sayHello();
18 
19 //    上面的案例首先建立一個構造函數Person，然後使用構造函數建立對象p.
20 //    這裡使用 new文法.然後使用對象調用sayHello()方法.
21 //    這個使用構造函數建立對象的案例比較簡單. 從案例可以看到，此時 this指的是對象本身.      

五、apply、call調用模式

上篇中詳細講解了。