this指向总结:严格模式和非严格模式
函数中的this指向和当前函数在哪定义和在哪执行的没有任何的关系
分析this指向的规律如下:
【非严格模式下】
1.自执行函数中的this永远都是window
【案例1】
var obj = {
fn:(function(i){
//this->window
return function () {
//this->obj
}
})(0)
}
2.给元素的某个行为绑定一个方法,当行为触发的时候,执行绑定的方法,此时方法中的this是当前元素
【案例1】
oDiv.onClick = function () { // this->oDiv}
【案例2】
function fn() {
//this->window
}
oDiv.onClick = function () {
//this->oDiv
fn();
}
3.方法执行,看方法名前面是否有“.”,有的话,“.”前面是谁this就是谁,没有的话this就是window
【案例1】
var obj = { fn:fn };
function fn() {}
fn.prototype.aa = function (){};
var f = new fn
fn(); // this=window
obj.fn(); //this=obj
fn.prototype.aa(); // this->fn.prototype
f.aa(); // this=f
f.__proto__.aa(); // this->f.__proto__ ->fn.prototype
4.在构造函数中,函数体中的this.xxx = xxx中的this是当前类的一个实例
【案例1】
function Fn() {
this.x = 100; // this->f
this.getX = function() {
console.log(this); // this->f 因为getX方法执行的时候,“.”前面是f,所以this是f
}
}
var f = new Fn;
f.getX()
5.使用call/apply来改变this的指向(一旦遇到call/apply上述四条都没用了)
【严格模式】
“use strict”; // 告诉浏览器我们接下来编写的JS代码采用严格模式
1.只执行函数中的this永远是undefined
【案例1】
var obj = {
fn:(function(i){
// this->undefined
return function () {
// this->obj
}
})(0)
}
obj.fn();
2.方法执行,看方法名前面是否有“.”,有的话,“.”前面是谁this就是谁,没有的话this是undefined
【案例1】
var obj = {fn:fn}
function fn () {}
fn();// this->undefined
obj.fn() // this->obj
我们发现严格模式下的this相对于非严格模式下的this的主要区别在于:对于JS代码中没有写执行主体的情况下,非严格模式默认都是window执行的,所以this指向的是window,但是在严格模式下,没有写执行主体,this指向是undefined;