this的应用及指向问题

this的应用及指向问题

​ 总的原则，那就是this指的是调用函数的那个对象，即谁调用函数，this指向谁

//1.普通函数，定时器里面的函数，回调函数（函数做参数），自执行函数 --指向window（非严格模式）
  	function fn(){
		alert(this)；
	}
	fn() 
	
	window.setInterval(function(){
		alert(this);
	},1000)
	
	var arr=[1,2,3];
	arr.forEach(function(){
		alert(this);
	});
	
	(function(){
		alert(this);
	})()
	
	!function(){
		alert(this);
	}();
//2.对象里面的方法 --谁调用指向谁
	var obj = {
		a:1,
		showa:function(){
			function fn(){
				console.log(this) //没人调用它，默认window调用，所以这里的this指向window
			}
			alert(this);
			alert(this.a);
		}
	}
	obj.showa(); //由于是obj调用这个函数，那么this指向obj

	var fn1 = obj.showa; //这里可以看成 var fn1 = function(){
													function fn(){
														console.log(this) 
														}
														alert(this);
														alert(this.a);
													}
	
	fn1();//此时window调用fn1(),所以this指向window
//3.事件处理函数
	document.onclick = function(){
		alert(this); //这里由于是document调用这个函数所以this指向document
	}

//4.构造函数
	//构造函数的特点 1.首字母大写  2.一定要new运算符调用一下
	function Abc(){   //Abc:构造函数
		alert(this);	// this 指向 a1,a2
		this.name = 'zxh'  //由于这个this有个属性name所以它的实例对象都具有这个属性
	}
	var a1 = new Abc() //实例对象a1 a1.name = 'zxh'
	var a2 = new Abc() //实例对象a2 a2.name = 'zxh'

改变this的指向

想让this指向谁就指向谁的方法，this是整个js很重要的关键字

//函数下面的三个方法：call，apply，bind都可以改变this的指向

var num=10000;
var obj={
	num：10,
	shownum:function(){
		alert(this.num)
	}
	show:function(num1,num2){
		alert(this.num + num1 + num2)
	}
}
obj.shownum() //输出的是10
obj.shownum().call(window) //输出10000

obj.show(20,30) //输出10+20+30 = 60
obj.show.call(window,20,30) //输出10000+20+30 = 10050

//总结 call()的第一个参数是代表this的指向对象，后面的参数代表函数本身的参数
	  apply()唯一与call()不同的是 apply的第二个参数是一个数组 obj.show.call(window,[20,30]) //依然输出10050 
	  bind():第一个参数代表this的指向对象,从第二个参数开始代表的是函数本身的参数,返回的是函数体，需要再次调用。
	  解析：obj.show.bind(window,20,30) //输出的是一个函数体
	  	   obj.show.bind(window,20,30)() //10050
	  使用场景:由于很多时候函数不是直接调用的,而是通过事件或定时器触发