几句话就能秒懂JavaScript的this

在 JavaScript 中 this会随着执行环境的改变而改变，简单解释就是

谁调用那么this就是谁

---

1、在方法中，this 表示该方法所属的对象。（函数和对象写在一起时，函数就变成了方法）

<script>
const obj={
	name:'lxx',
	say:function(){
		console.log(this);//{name: "lxx", say: say:function(){}}
	}
}
obj.say();//按谁调用那么this就是谁的原则，所以say里的this就是obj
</script>

2、如果单独使用，this 表示全局对象。

console.log(this);//window{...}
//按谁调用那么this就是谁的原则，其实理解为window

3、在函数中，this 表示全局对象。

function fn(){
	console.log(this);//window{...}
}
fn()//按谁调用那么this就是谁的原则，其实理解为window.fn()

4、在函数中，在严格模式下，this 是未定义的(undefined)。

<script>
"use strict"
function fn(){
	console.log(this);//undefined，和普通模式不一样是因为默认不会引用全局
}
fn()
</script>

5、在事件中，this 表示接收事件的元素。

<div id="btn">点击我</div>
<script>
document.getElementById("btn").addEventListener("click",function(){
	console.log(this)//<div id="btn">点击我</div>
})
</script>

6、在函数方法Object.apply()与Object.call()中，this则为()里的第一个参数。

<script>
function fn(){
	console.log(this);//window{...}
}
fn.apply({name:'lxx'},[1,2,3]) //{name:'lxx'}
fn.call({name:'lxx'},1,2,3) //{name:'lxx'}
</script>