Javascript this关键字 指向详解

面向对象语言中 this 表示当前对象的一个引用。在 JavaScript 中 this 不是固定不变的，它会随着执行环境的改变而改变。

1） 单独使用，this 表示全局对象。

<script type="text/javascript">console.log(this) // 指向window全局对象
</script>

2） 在方法中，this 表示该方法所属的对象。

var person = {firstName: "John",lastName : "Doe",id     : 5566,fullName : function() {return this.firstName + " " + this.lastName; // 指向person对象}
};
person.fullName();  // John Doe

3）在函数中，this 表示全局对象。 在严格模式下，this 是未定义的(undefined)。

<script type="text/javascript">var q = "hello"var func = function(){var q = 'wang'console.log(this.q) // hello}func()
</script>

<script type="text/javascript">var q = "hello"var func = function(){var q = 'wang'console.log(this.q)  // Cannot read property 'q' of undefined}func()
</script>

4. 在事件中，this 表示接收事件的元素

<button onclick="this.style.display='none'">点我后我就消失了</button>

5） 作为构造函数调用 构造函数试图初始化这个新创建的对象，并将这个对象作为其调用上下文，this 指向这个新创建的对象。

var q = 'window'
function Func() {this.q = 'hello'console.log(this.q)  //hello
}
var obj = new Func

6. 通过函数的call/apply方法间接调用 call/apply方法的第一个参数是调用上下文，在函数体内，通过this获得对它的引用。

var q = 'window'
function func() {console.log(this.q)
}
var obj = {q: 'obj'
}
func.apply()  //window
func.call() //window
func.apply(obj) //obj
func.call(obj) //obj

7. 箭头独立函数 : 本身没有this，内部的this就是外层代码块作用域中的this
   因箭头函数没有this,固不能用作构造函数，否则会报错

var a = 0
var test = ()=>{var a = 1console.log(this.a)
}
test() // 0