函數的幾種調用方式
01 普通函數調用 內部的this指向全局對象window
02 構造函數調用 內部的this指向新創建的對象
03 對象的方法調用 內部的this指向調用的對象本身
04 通過call 或者是apply方式調用(函數上下文),this指向的是當前的上下文對象
this丟失demo演示
<script>
var obj = {
name:"張三",
getName:function () {
console.log(this.name);
}
};
//以對象的方法來進行調用
obj.getName(); //張三
var getName = obj.getName;
getName(); //以普通函數的方式調用,此時內部的this指向的是window對象 打印的是window.name 為空值
</script>
代碼示例02
<script>
//01 獲取頁面中id值為demo的標簽
//var div = document.getElementById('demo');
// var getId = document.getElementById;
// var div = getId('demo'); //會報錯?
// console.log(div);
//借用apply來修正this
document.getElementById = (function (func) {
return function () {
return func.apply(document,arguments);
}
})(document.getElementById);
var getId = document.getElementById;
var div = getId('demo'); //會報錯?
console.log(div);
</script>
代碼說明:
01 因為document.getElementById方法的內部實現中需要使用到this,這個this本來期望指向的是document對象
02 當我們以document.getElementById來調用的時候,內部的this指向document對象
03 但是當我們以getId的方式調用的時候,內部的this指向的是window對象(因為我們以普通的方式進行調用)
- this: this所在的函數在哪個對象中, this就指向該對象(大部分情況);
- 少數情況特殊:
- 如果this在定時器中, this就指向window;
- 如果this在事件源中, this就指向產生這個事件源的對象。