如果你真正理解Javascript函數(shù)是如何調(diào)用工作的，那么就可以避免一些bug的發(fā)生；
首先讓我們創(chuàng)建一個簡單的函數(shù),這個函數(shù)將在下文中使用,這個函數(shù)僅僅返回當前的this的值和兩個提供的參數(shù).
代碼如下:
function makeArray(arg1, arg2){
return [ this, arg1, arg2 ];
}
調(diào)用這個函數(shù)非常的簡單,我們需要做的僅僅是：
代碼如下:
makeArray('one', 'two');
返回值：=> [ window, 'one', 'two' ]
問題出現(xiàn)了，this的值怎么會變成了window？下面做個簡單分析：
在Javascript里,有一個全局的對象, 那些看起來散落在你的腳本里的每一行代碼，其實都被寫在了一個全局對象的上下文里.在我們的例子中,其實那個makeArray 函數(shù)可以說不是一個松散的全局函數(shù),而是全局對象的一個方法, 讓我們返回來看瀏覽器,在這個環(huán)境里它的全局對象被映射到window對象.讓我們來證明一下:
代碼如下:
alert( typeof window.makeArray);
返回值：=> function
所有的這些意味著我們之前調(diào)用makeArray的方法是和下面調(diào)用的方法一樣的，
代碼如下:
window.makeArray('one', 'two');
返回值：=> [ window, 'one', 'two' ]
JavaScript函數(shù)調(diào)用規(guī)則1：在沒有通過明確所有者對象而直接調(diào)用的函數(shù)中，如myFunction()，將導(dǎo)致this的值成為默認對象（瀏覽器中的窗口）。
現(xiàn)創(chuàng)建一個簡單的對象,使用makeArray函數(shù)作為它的一個方法,我們將使用json的方式來聲明一個對象,我們也來調(diào)用這個方法：
代碼如下:
var arrayMaker = {
someProperty: 'some value here',
make: makeArray
};
arrayMaker.make('one', 'two');
// 返回：=> [ arrayMaker, 'one', 'two' ]
arrayMaker['make']('one', 'two');
// 返回：=> [ arrayMaker, 'one', 'two' ]
this的值變成了對象arrayMaker本身.你可能會疑問原始的函數(shù)定義并沒有改變,為何它不是window了呢.函數(shù)是一個對象，你可以傳遞它們或者復(fù)制他們.就好像整個函數(shù)連帶參數(shù)列表和函數(shù)體都被復(fù)制,且被分配給了arrayMaker里的屬性make,那就好像這樣定義一個arrayMaker:
代碼如下:
var arrayMaker = {
someProperty: 'some value here',
make: function (arg1, arg2) {return [ this, arg1, arg2 ];}
};
JavaScript函數(shù)調(diào)用規(guī)則2： 在一個使用方法調(diào)用語法,像 obj.myFunction()或者 obj['myFunction'](),這時this的值為obj。
這是事件處理代碼中bug的主要源頭,看看下面的例子：
代碼如下:
<input type="button" value="Button 1" id="btn1" />
<input type="button" value="Button 2" id="btn2" />
<input type="button" value="Button 3" id="btn3" onclick="buttonClicked();"/>
<script type="text/javascript">
function buttonClicked(){
var text = (this === window) ? 'window' : this.id;
alert( text );
