javascript中的self和this用法小結_javascript技巧

一、 起因
那天用到prototype.js於是打開看看，才看幾行就滿頭霧水，原因是對js的面向對像不是很熟悉，於是百度google了一把，最後終於算小有收穫，寫此紀念一下^_^。
prototype.js程式碼片段

程式碼如下:
var Class = {
    create: function() {
        return function() {         }
    }
}
// Class使用方法如下
var A = Class.create();
A. prototype={
    initialize:function(v){     }
    showValue:function(){
        alert(this.value);
A  
a. showValue();//彈出對話框helloWord！

l initialize是什麼?
l apply方法是做什麼的？
l arguments變數呢？
l 為什麼new A後就會執行initialize方法？

找答案：

二、 Js的物件導向

initialize是什麼?

只不過是個變量，代表一個方法，用途是類別的建構子。

其具體功能靠js的物件導向支持，那麼js的物件導向是什麼樣子的那？而java 的有什麼相同與不同？ 看程式碼：
程式碼如下:

複製程式碼

程式碼如下:var ClassNamev ){     this.value=v;     this.getValue=function(){

        return this.value       this .value=v;

    }
}


那麼JS中的函數和類別有什麼不同呢？
其實是一樣的，ClassName就是一個函數，當出現在new後面的時候就當作一個建構子來建構物件。
如

程式碼如下:
var objectName1 = new ClassName(“a”);//得到一個物件

其中objectName1就是執行ClassName建構子後得到的對象，而在ClassName函式中的this指的就是new之後建構出來的對象，所以objectName1會後一個屬性和兩個方法。可以透過這樣​​來呼叫他們：

程式碼如下:
objectName1.setValue(''hello''); alert(objectName1.getValue());//對話框hello

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

那麼

程式碼如下:

var objectName2 = ClassName(“b”);//得到一個物件

這樣objectName2得到的是什麼呢？顯然是方法的回傳值，這裡ClassName只作為了一個普通的函數（雖然首字母大寫了）。但之前寫的ClassName中並沒有回傳值，所以objectName2會是undifinded那麼「b」賦給誰了呢？在這並沒有產生一個對象，而只是單純的執行這個方法，所以這個“b”賦值給了調用這個方法的對象window，證據如下：
var objectName2 = ClassName(“b”);//得到一個物件

alert(window.value)；//對話框b

所以JS中的所有function都是一樣的，但是用途可能是不同的（用作構造對象抑或是執行一個過程）。

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

程式碼如下:

複製程式碼

程式碼如下:

var Class = { >    create: function() {         return function() {               } } var A = Class.create ();

這段程式碼是建構個一個function複製給A，這個function是

程式碼如下:




複製程式碼

程式碼如下:

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

並且後面這個方法是用來做建構子的。當使用這個建構子來建構物件的時候，會讓建構出來的這個物件的initialize變數執行apply()方法，apply()的用途後面在說，繼續說initialize。這樣在初始化物件的時候會聯絡到initialize（怎麼聯絡就要看apply的了）。
那麼

程式碼如下:

複製程式碼 程式碼如下:

A.prototype={


A.prototype={


A.prototype={

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

是什麼意思呢？ Prototype是「原型」的意思。 A是一個function（），那麼A. prototype，就是function中的一個變量，其實是個物件。這個物件擁有什麼方法，那麼function產生的物件就擁有什麼方法，故
var a = new A(‘helloWord!');
a. showValue();//彈出對話框helloWord！
所以a物件也會有initialize方法，不只如此，每個有A建構出來的物件都會有一個initialize方法，而在前面說過，建構的時候會呼叫建構函數，建構函式裡面會讓initialize去呼叫apply方法，於是在new A('helloWord!')的時候initialize回去呼叫apply方法。這也就是呼叫了一個初始化的方法。

三、 call()和apply()

下面開始研究apply()，在網路上找了幾個資料，並結合自己的研究，了解了call()和apply( )的功能。功能基本上一樣，function().call(object,{},{}……)或function().apply (object,[……])的功能就是物件object呼叫這裡的funciton()，不同之處是call參數從第二個開始都是傳遞給funciton的，可以依次羅列用“，”隔開。而apply只有兩個參數，第二個是一個數組，其中儲存了所有傳遞給function的參數。
this.initialize.apply(this , arguments); 是什麼意思？

這裡的第一個this，是指用new呼叫建構子之後產生的對象，也就是前面的a，那麼第二個this也當然應該是指同一個物件。那這句話就是this（也就是a）呼叫initialize方法，參數是arguments物件（參數的陣列物件），所以在建構函式執行的時候，物件a就會去執行initialize方法來初始化，這樣就跟單字“ initialize」的意思對上了。

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

四、 Arguments物件 這段程式碼能說明一切了： 程式碼如下:

複製程式碼


程式碼如下:


function test({
    alert(typeof arguments);

    for(var i=0; i        alert(arguments[ ("1","2","3"); test("a","b");

執行後alert(typeof arguments);會顯示object，說明arguments是物件。然後會依序打出1、2、3。說明arguments就是呼叫函數的實參數組。 程式碼如下:

複製程式碼

程式碼如下:


var Class = { >    create: function() {
        return function() {
              }
}

arguments 就是create傳回的建構子的實參數組，那麼在
var a = new A('helloWord!'); 的時候'helloWord!'就是實參數組（雖然只有一個字串），傳遞給方法apply，然後在呼叫initialize 的時候作為參數傳遞給初始化函數initialize。