js函數對象

JS學習筆記——JS面向對象、prototype、call()、apply()

博客分類：
js

prototype

prototype.js代碼片斷 Js代碼 收藏代碼

var Class = {  
  
  create: function() {  
  
    return function() {  
  
      this.initialize.apply(this , arguments);  
  
    }  
  
  }  
  
}  
  
// Class使用方法以下  
  
var A = Class.create();  
  
A. prototype={  
  
initialize:function(v){  
  
    this .value=v;  
  
}  
  
showValue:function(){  
  
    alert(this.value);  
  
}  
  
}  
  
var a = new A(‘helloWord!’);  
  
a. showValue();//彈出對話框helloWord！

l initialize是什麼?

l apply方法是幹什麼的？

l arguments變量呢？

l 爲何new A後就會執行initialize方法？

2、 Js的面向對象

initialize是什麼?

只不過是個變量，表明一個方法，用途是類的構造函數。

其具體功能靠js的面向對象支持，那麼js的面向對象是什麼樣子的那？和java 的有什麼相同與不一樣？

看代碼： Js代碼 收藏代碼

var ClassName = function(v){  
  
        this.value=v;  
  
        this.getValue=function(){  
  
                     return this.value;  
  
              }  
  
              this.setValue=function(v){  
  
                     this.value=v;  
  
              }  
  
}

那麼JS中的函數和類有什麼不一樣呢？

實際上是同樣的，ClassName就是一個函數，當出如今new後面的時候就做爲一個構造函數來構造對象。

如

Js代碼 收藏代碼

var objectName1 = new ClassName(「a」);//獲得一個對象

其中objectName1就是執行ClassName構造函數後獲得的對象，而在ClassName函數中的this指的就是new以後構造出來的對象，因此objectName1會後一個屬性和兩個方法。能夠經過這樣來調用他們： Js代碼 收藏代碼

objectName1.setValue(''hello'');  
  
alert(objectName1.getValue());//對話框hello  
  
alert(objectName1.value) ;//對話框hello

那麼 Js代碼 收藏代碼

var objectName2 = ClassName(「b」);//獲得一個對象

這樣objectName2獲得的是什麼呢？顯然是方法的返回值，這裏ClassName只做爲了一個普通的函數（雖然首字母大寫了）。可是在以前寫的ClassName中並無返回值，因此objectName2會是undifinded那麼「b」賦給誰了呢？在這並無產生一個對象，而只是單純的執行這個方法，因此這個「b」賦值給了調用這個方法的對象window，證據以下： Java代碼 收藏代碼

var objectName2 = ClassName(「b」);//獲得一個對象  
  
alert(window.value)；//對話框b

因此JS中的全部function都是同樣的，可是用途多是不一樣的（用做構造對象抑或是執行一個過程）。

下面該回到主題了initialize是幹什麼的？

Js代碼 收藏代碼

var Class = {  
  
  create: function() {  
  
    return function() {  
  
      this.initialize.apply(this , arguments);  
  
    }  
  
  }  
  
}  
  
var A = Class.create();

這段代碼是構造個一個function複製給A，這個function是

Js代碼 收藏代碼

function() {  
  
      this.initialize.apply(this , arguments);  
  
}

而且後面這個方法是用來作構造函數的。當使用這個構造函數來構造對象的時候，會讓構造出來的這個對象的initialize變量執行apply()方法，apply()的用途後面在說，繼續說initialize。這樣在初始化對象的時候會聯繫到initialize（怎麼聯繫就要看apply的了）。

那麼 Js代碼 收藏代碼

A. prototype={  
  
initialize:function(v){  
  
    this .value=v;  
  
}  
  
showValue:function(){  
  
    alert(this.value);  
  
}  
  
}

是什麼意思呢？

Prototype是「原型」的意思。A是一個function（），那麼A. prototype，就是function中的一個變量，實際上是個對象。這個對象擁有什麼方法，那麼function產生的對象就擁有什麼方法，故

Js代碼 收藏代碼

var a = new A(‘helloWord!’);  
  
a. showValue();//彈出對話框helloWord！

因此a對象也會有initialize方法，不僅如此，每個有A構造出來的對象都會有一個initialize方法，而在前面說過，構造的時候會調用構造函數，構造函數裏面會讓initialize去調用apply方法，因而在new A(‘helloWord!’)的時候initialize回去調用apply方法。這也就是調用了一個初始化的方法。

3、 call()和apply() 下面開始研究apply()，在網上找了幾個資料，並結合本身的研究，瞭解了call()和apply()的功能。功能基本同樣，function().call(object,{},{}……)或者function().apply (object,[……])的功能就是對象object調用這裏的funciton()，不一樣之處是call參數從第二個開始都是傳遞給funciton的，能夠依次羅列用「，」隔開。而apply只有兩個參數，第二個是一個數組，其中存儲了全部傳遞給function的參數。 Js代碼 收藏代碼

this.initialize.apply(this , arguments);

是什麼意思？

這裏的第一個this，是指用new調用構造函數以後生成的對象，也就是前面的a，那麼第二個this也固然應該是指同一個對象。那這句話就是this（也就是a）調用initialize方法，參數是arguments對象（參數的數組對象），因此在構造函數執行的時候，對象a就會去執行initialize方法來初始化，這樣就和單詞「initialize」的意思對上了。

那麼執行initialize方法的參數怎麼傳遞進去的呢？

4、 Arguments對象 這段代碼能說明一切了 Js代碼 收藏代碼

function test(){  
  
     alert(typeof arguments);  
  
        for(var i=0; i<arguments.length; i++){  
  
              alert(arguments[i]);  
  
        }  
  
}  
  
test("1","2","3");  
  
test("a","b");

執行後alert(typeof arguments);會顯示object，說明arguments是對象。而後會依次打出一、二、3。說明arguments就是調用函數的實參數組。 Js代碼 收藏代碼

var Class = {  
  
  create: function() {  
  
    return function() {  
  
      this.initialize.apply(this , arguments);  
  
    }  
  
  }  
  
}

arguments 就是create返回的構造函數的實參數組，那麼在 Js代碼 收藏代碼

var a = new A(‘helloWord!’);

的時候‘helloWord!’就是實參數組（雖然只有一個字符串），傳遞給方法apply，而後在調用initialize 的時候做爲參數傳遞給初始化函數initialize