J37 this指向

1.this的区域

EC（执行上下文）：当前代码执行的环境

• 1.全局执行上下文
• 2.私有执行上下文（函数执行）
• 3.块级作用域(let /const)

2.this执行主体(谁把这个函数执行的)

函数的执行主体是谁，和在哪里定义的，以及在哪里执行的都没有必然的联系

• 1.THIS：执行主体是对象数据类型的（特殊情况：null/undefined）
• 2.方法执行，看方法前面是否有“点”，有“点”，“点”前面是谁，THIS就是谁；没有“点”，THIS一般指向的是window/undefined
• 3.如果是严格模式下（"use strict"），方法执行，前面没有点，也就是没有执行的主体，所以THIS是UNDEFINED；在非严格模式下，没有点认为执行主体都是全局对象WINDOW；

1.事件绑定期间，函数是不执行的，只是创建了一个函数，this就是一个字符串堆： “console.log(this); ”；只有当事件触发，浏览器才会把绑定的方法执行（不是自己执行的，是浏览器帮我们执行的，所以我们无法直接传递一些实参信息给函数）

var box = document.getElementById('box');
	box.onclick = function () {		
	console.log(this);
	//=>没有触发onclick时间，函数不执行，this是'console.log(this); '
		}; 

2.给元素的某个事件行为绑定方法，当行为触发，方法执行的时候，方法中的THIS “一般” 都是当前元素本身；当函数执行的时候，也就是点击onclick的时候this就是： box

var box = document.getElementById('box');
    box.onclick = function () {
	console.log(this); //=>当函数执行的时候，THIS是#BOX元素对象
    }; 

3.当函数执行的时候this是 box 点前面是谁，this就是谁

var box = document.getElementById('box');
	box.onclick = function () {
		console.log(this); //=>当函数执行的时候，THIS是#BOX元素对象
	}; 

4.函数执行和不执行的this是谁

 function func() {  
	console.log(this);
	return function anonymous() {};
}
box.onclick = func;
//=>把func函数本身赋值给元素的事件行为，从而完成事件绑定；
当点击元素的时候，执行的是func这个方法
box.onclick = func();
//=>先把func执行，把函数执行返回的结果赋值给元素的点击行为 
=>box.onclick=function anonymous() {}  点击元素执行的是anonymous方法 

5.特殊情况，这个this就不是元素本身了

• 而是window.IE6~8低版本浏览器中，基于attachEvent实现DOM2事件绑定，事件触发，方法执行，方法中的THIS不是元素本身了，而是window var box = document.getElementById('box');

var box = document.getElementById('box');
	box.attachEvent('onclick', function () {
	console.log(this === window); //=>true所以此时的this是window
	});

6.实名函数：执行主体前面没有点this就是window; 执行主体前面有点this就是obj

function func() {
			console.log(this);
		}
		var obj = {
			fn: func
		};

		func(); //=>方法中的THIS是WINDOW
		obj.fn(); //=>方法中的THIS是OBJ */		

7.自执行函数的this是：wiondow

 (function () {
	console.log(this);
})(); 

// (function () {}) 创建一个匿名函数
// () 把创建的匿名函数执行
// 创建和执行都是在一起的，所以称为“自执行函数”：这里面的THIS一般都是WINDOW	

8.在严格模式下（ "use strict"）,方法执行

• 1.前面没有点，也就是没有执行的主题，所以this就是undefined;（注：如果非严格模式下，没有点认为执行主体就是执行主体是全局对象window）
• 2.如果有点，点前面是谁this就是谁

"use strict";
(function () {
	console.log(this); //=>undefined
})();

function func() {
	console.log(this);
}
var obj = {
	fn: func
};
func(); //=>方法中的THIS是UNDEFINED
obj.fn(); //=>方法中的THIS是OBJ  

9.综合

function func() {
console.log(this.name);//函数未执行，this是'console.log(this.name);'
}

var box = document.getElementById('box');
box.name = "#BOX";
var name = "WINDOW"; //=>window.name = "WINDOW"
var obj = {
	name: "OBJ",
	func: func
};

func(); //=>执行函数console.log(this.name)=window.name = "WINDOW"

obj.func(); //=>执行obj中func，而执行的func是一个函数
，就去执行函数，console.log(this.name);=obj.name="OBJ"

box.onclick = func; //=>点击BOX触发FUNC执行  "#BOX"

box.onmouseenter = function () {
	// 鼠标进入盒子，触发匿名函数执行，匿名函数中的THIS=>BOX
	// 匿名函数执行过程中，才执行的FUNC函数，此时FUNC中的THIS=>WINDOW
	func();
};