Javascript中的this指向问题的理解

this指向,是前端开发人员一直比较头疼的问题,一般称为万恶的this指向,我们去面试,经常也会遇到面试官给你的this指向的有关题目,有些基本靠猜,希望经过本文的学习,会对this指向有个很直观的判断!

注意:

普通函数this指向由调用方式决定,跟定义环境无关,也就是说,普通函数的this指向,实际上是动态作用域确定的

箭头函数this指向由定义环境决定的,与调用方式无关,也不可以强制改变它的this指向,实际上箭头函数是没有this指向的,指向的是外层.

Javascript中的this指向问题的理解

定时器的处理函数 this 指向window
Javascript中的this指向问题的理解

事件处理函数 this 指向事件源本身

Javascript中的this指向问题的理解
对象内部的方法调用 , this 指向 调用者 obj

Javascript中的this指向问题的理解
经典示例:
Javascript中的this指向问题的理解
这个时候,打印的是10,我们来分析下原因:
Javascript中的this指向问题的理解
经典案例2
Javascript中的this指向问题的理解
分析 原因: 对象内部的方法 中this指向调用者 ,而此时的调用者就是 obj 中的 b 对象中没有a, 所以结果就是undefined

构造函数指向返回值
返回复杂对象

Javascript中的this指向问题的理解

当返回复杂对象时,this指向新对象,也就是new Person()返回的新对象

返回值类型

Javascript中的this指向问题的理解
返回null

Javascript中的this指向问题的理解

虽然typeof null返回的是object,但是说到底,它还是值类型的,所以还是返回this对象实例本身