深度了解this指向(变化莫测,坑贼多)

this指向为什么经常会搞错,是因为它不是一成不变的,但虽然它是变化的,指向的规则肯定是确定的。

this指向规则:(this指向取决于执行函数有没有调用者)

  1. 没有调用者,默认指向全局 window(严格模式下是undefined)
  2. 有调用者,则指向调用者,调用者有可能是对象、数组等等

①先看这个

window.onload = function(){
	var length = 88;
	function test(){
		console.log(this.length)
	}
	test();
}

结果很显然是:88,this指向window

window.onload = function(){
	var length = 88;
	function test(){
		console.log(this.length)
	}
	var obj = {
		length:99, 
		action:test
	}
	obj.action()
}

结果是:99,test被obj.action()调用,this指向obj

window.onload = function(){
	function test(){
		console.log(this)
	}
	var arr=[test,1,2,3,4];
	arr[0]();
}

结果是:[ƒ, 1, 2, 3, 4],this指向arr数组

④接下来看一个很坑的题

window.onload = function(){
	var length = 88;
	function test(){
		console.log(this.length)
	}
	var obj = {
		length:99, 
		action:function(test){
			test();//this没有调用者,指向window
			arguments[0]();//this指向arguments,this.length也就是arguments.length,为参数的个数
		}
	}
	obj.action(test,[1,2,3]);
}

结果:88 2

⑤由apply、call、bind改造的函数:其this指向第一个参数

function add(c,d){
	return this.a + this.b + c + d //1+2+5+7
}
var obj= {a:1,b:2}
add.call(obj,5,7)

结果:15,this指向obj

⑤闭包里的this指向

var user = {
 count : 1,
 getCount: function(){
  return this.count;
 }
}
var func = user.getCount

结果:undefined,this指向window

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值