作為函數(shù)調(diào)用
在函數(shù)被直接調(diào)用時(shí)this綁定到全局對(duì)象昆稿。在瀏覽器中廉沮，window 就是該全局對(duì)象
console.log(this);
// Window
function fn1(){
console.log(this);
}
fn1();
// Window
作為內(nèi)部函數(shù)
函數(shù)嵌套產(chǎn)生的內(nèi)部函數(shù)的this不是其父函數(shù)，仍然是全局變量
function fn0(){
function fn(){
console.log(this);
}
fn();
}
fn0();
// Window
作為構(gòu)造函數(shù)調(diào)用
所謂構(gòu)造函數(shù)贫导，就是通過(guò)這個(gè)函數(shù)生成一個(gè)新對(duì)象（object）抱完。這時(shí)贼陶，this就指這個(gè)新對(duì)象
function Person(name){
this.name = name;
}
Person.prototype.printName = function(){
console.log(this.name);
};
var p1 = new Person('Byron');
p1.printName();
// Byron
作為對(duì)象方法調(diào)用
函數(shù)可以作為對(duì)象的一個(gè)屬性時(shí)，this 被自然綁定到該對(duì)象
var nick = 'aaa';
var obj1 = {
nick: 'bbb',
fn : function(){
console.log(this.nick);
}
};
var obj2 = {
nick: 'ccc'
}
obj1.fn();
// bbb
obj2.fn = obj1.fn;
obj2.fn();
// ccc
DOM對(duì)象綁定事件
在事件處理程序中this代表事件源DOM對(duì)象（低版本IE有bug，指向了window）
document.addEventListener('click', function(e){
console.log(this);
// document
var _document = this;
setTimeout(function(){
console.log(this);
// window
console.log(_document);
}, 200);
}, false);
使用call和apply設(shè)置this
語(yǔ)法很簡(jiǎn)單每界，第一個(gè)參數(shù)都是希望設(shè)置的this對(duì)象捅僵，不同之處在于call方法接收參數(shù)列表家卖，而apply接收參數(shù)數(shù)組
fn2.call(obj1);
fn2.apply(obj1);
caller
在函數(shù)A調(diào)用函數(shù)B時(shí)眨层，被調(diào)用函數(shù)B會(huì)自動(dòng)生成一個(gè)caller屬性，指向調(diào)用它的函數(shù)對(duì)象上荡，如果函數(shù)當(dāng)前未被調(diào)用趴樱，或并非被其他函數(shù)調(diào)用，則caller為null
function fn4(){
console.log(fn4.caller);
// null
function fn(){
console.log(fn.caller);
// 函數(shù)fn4
}
fn();
}
fn4();
arguments
- 在函數(shù)調(diào)用時(shí)酪捡，會(huì)自動(dòng)在該函數(shù)內(nèi)部生成一個(gè)名為 arguments的隱藏對(duì)象
- 該對(duì)象類似于數(shù)組叁征，可以使用[]運(yùn)算符獲取函數(shù)調(diào)用時(shí)傳遞的實(shí)參
- 只有函數(shù)被調(diào)用時(shí)，arguments對(duì)象才會(huì)創(chuàng)建逛薇，未調(diào)用時(shí)其值為null
function fn5(name, age){
console.log(arguments);
name = 'XXX';
console.log(arguments);
arguments[1] = 30;
console.log(arguments);
}
fn5('Byron', 20);
// ["Byron", 20]
// ["XXX", 20]
// ["XXX", 30]
callee
當(dāng)函數(shù)被調(diào)用時(shí)捺疼，它的arguments.callee對(duì)象就會(huì)指向自身，也就是一個(gè)對(duì)自己的引用
function fn6(){
console.log(arguments.callee);
}
fn6();
匿名函數(shù)特好用
var i =0;
window.onclick = function(){
console.log(i);
if(i<5){
i++;
setTimeout(arguments.callee, 200);
}
}
//0
//1
//2
//3
//4
//5
綜合練習(xí)
var app = {
init: function(){
this.target = document.querySelector('#btn');
this.bind();
},
bind: function(){
var _this = this;
// app
setTimeout(this.sayHaha, 2000);
// 因?yàn)闆](méi)有匿名函數(shù)說(shuō)以this=app
this.target.addEventListener('click', function(){
// app.target=#btn
var self = this;
// #btn
this.innerText = '我被點(diǎn)了';
// #btn
_this.sayHello();
// app
setTimeout( function(){
self.innerText = '點(diǎn)我';
// btn
console.log(this);
// window
_this.sayGoodBye.call(self);
// 使用call的方法使得sayGoodBye的變?yōu)閟elf,即#btn
});
},
sayHello: function(){
console.log('hello...')
console.log(this);
// 因?yàn)榻壎ㄔ赼pp上永罚，所以this為app
},
sayGoodBye: function(){
console.log('sayGoodBye...')
console.log(this)
// 使用call的方法使得sayGoodBye的變?yōu)閟elf,即#btn
},
sayHaha: function(){
console.log('say Haha...');
console.log(this)
// 匿名函數(shù)啤呼，this為Window
}
};
app.init();
