JS篇之this指向以及如何改变this指向

this指向的几种类型
        
        1.作为普通函数调用 this指向window   

var x = 1
var y = 2
function test(){
    var x = 2
    console.log(this.x,this.y,x) // 1 undefined 2
}
window.test() // 实际上是window直接调用的test()

        2.作为对象方法的调用 this指向该对象

let obj = {
    x: 1,
    fn: function(){
		return this.x
	}
}
obj.fn() // 1 实际上是 window.obj.fn() obj直接调用 window间接调用 所以this指向obj

// 如果let fn1 = obj.fn 
fn1() // x 为undefind 因为实际上为 window.fn1() 所以this指向window 而在全局作用域里并没有x变量

        3.作为构造函数调用 this就指这个new出来的新对象

var x = 1
function T(){
	this.x = 2
}
let obj1 = new T()
console.log(this.x) // 2 说明this不指向window 指向obj1实例

        4.通过事件绑定的方法， 此时 this 指向 绑定事件的对象
        5.定时器的this指向window

改变this指向的三种方式：

        1.call

var obj = {
	name: '张三',
	age: '80'
}

var a = {
	name: '1',
	age: '10',
	fn(na, ag) {
		console.log(this.name, this.age, na, ag);
	}
}
a.fn.call(obj, 1, 2);  // 张三 80 1 2 this指向obj

        2.apply

var obj = {
	name: '张三',
	age: '80'
}

var a = {
	name: '1',
	age: '10',
	fn(na, ag) {
		console.log(this.name, this.age, na, ag);
	}
}
a.fn.apply(obj, [1,2]);  // 张三 80 1 2

        3.bind

var obj = {
	name: '张三',
	age: '80'
}

var a = {
	name: '1',
	age: '10',
	fn(na, ag) {
		console.log(this.name, this.age, na, ag);
	}
}
a.fn.bind(obj, 1, 2)();  // 张三 80 1 2 	因为返回的是一个函数所以需要调用