你真的懂this指向？

逃离我推掉我的手 2021-09-17 20:40 339阅读 0赞

## 先搞清楚一点，如果this在函数里面，那么它指向的是“函数执行后”的上一级调用对象。 ##

var a="this is a";
    		function main() { 
    		console.log(this.a)//这里this指向window.
    		}
    		main()//这里相当于window.main()，默认window对象了，所以可以省略;

var o={ 
    			x:"this is x",
    			y:"this is y",
    			say:function(){ 
    				console.log(this.x);
    			}
    		}
    		o.say();//这里的this指向的是对象o，因为你调用这个say是通过o.say()执行的，那自然指向就是对象o，这里再次强调一点，this的指向在函数创建的时候是决定不了的，在调用的时候才能决定，谁调用的就指向谁，一定要搞清楚这个。

var o={ 
    			name:"maomin",
    			say1:function(){ 
    				console.log(this.name);//maomin
    			}
    		}
    		window.o.say1();
    		// 上面几行代码和之前的代码几乎相似，为什么没有指向window,这就回到了我刚开始说的，this如果在函数内，那么它指向的是该函数执行后的上一级调用对象。

function Fn(job){ 
    			this.job=job;
    		}
    		var i=new Fn("I am Engineer");
    		console.log(i.job);//I am Engineer
    	// 这里是一个构造函数，注意的是this指向构造函数new出来的对象。
    	// 首先new关键字会创建一个空的对象，然后会自动调用一个函数的一个方法，将this指向这个空对象，这样的话函数内部的this就会被这个空的对象替代。

针对上面一大堆的代码和解释是不是对this指向有点头疼呢，当然上面的都是在函数体内的，还有其他情况的this指向这里没说。  
下面只是简单的列举  
**规律1 函数圆括号直接调用 函数上下文为window**  
**规律2 函数作为对象的方法打点调用 函数上下文就是这个对象**  
**规律3 函数作为事件的处理函数 函数上下文就是出发这个事件的对象**  
**规律4 定时器调用函数 函数上下文为window**  
**规律5 数组存放的函数 被数组索引调用 this就是这个数组**  
**其实这五个规律前四个都涉及过，就是第五个没有接触过**

function fun() { 
    		console.log(this)
    }
    	var arr=[fun,"a","a"];
    	arr[0]();

其实仔细总结，如果this在函数里面，那么**它指向的是“函数执行后”的上一级调用对象一直适用。**