this到底指向谁,是当我们调用函数时候才能确定的,调用方式不同,this指向不同
普通函数调用-->指向window
function fn() {
console.log('普通函数');
console.log(this); //window
}
fn();
构造函数调用-->指向实例对象,原型上的方法也指向这个实例化对象
function Funn(name, age) {
this.name = name;
this.age = age
console.log(this); //Funn {name: '小鹏', age: 22}
}
Funn.prototype.sing = function() {
console.log('原型上的方法');
console.log(this); //Funn {name: '小鹏', age: 22}
}
var xiaoming = new Funn('小鹏', 22);
xiaoming.sing();
对象方法调用-->指向该方法所属的对象
var techer = {
name: '小鹏',
exam: function() {
console.log('对象的方法');
console.log(this); //{name: '小鹏', exam: ƒ}
}
}
techer.exam();
事件绑定方法-->指向绑定事件的对象
<button>事件绑定</button>
var btn = document.querySelector('button');
btn.onclick = function() {
console.log('我是事件绑定');
console.log(this); //<buttton>事件绑定</button>
};
定时器函数-->指向window
setTimeout(function() {
console.log('定时器');
console.log(this); //window
}, 2000);
立即执行函数-->window
(function() {
console.log('立即执行函数');
console.log(this); //window
})()