this的几种模式
- 方法调用模式下，this总是指向调用它所在方法的对象，this的指向与所在方法的调用位置有关，而与方法的声明位置无关（箭头函数特殊）。
//声明位置
var fn=function(){
console.log(this.x)
}
var x="2"
var obj={
x:"1",
fn:fn
}
//调用位置
obj.fn();//1
//调用位置
fn(); //2
- 函数调用下，this指向window,调用方法没有明确对象的时候，this指向window,，如setTimeout,匿名函数等。
var x="2"
//声明位置
var fn=function(){
console.log(this.x)
}
//调用位置
fn();//2
var flag=undefined;
function Fn(){
flag=this;
}
var obj=new Fn()
console.log(flag==obj)
- apply,call,bind调用模式下，this指向第一个参数。
var obj={
name:'hty',
getName:function(){
console.log(this.name)
}
}
var otherObj={
name:'hml'
}
var name='upupup'
obj.getName()//hty
obj.getName.call();//upupup
obj.getName.call(otherObj);//hml
obj.getName.apply();//upupup
obj.getName.apply(otherObj);//hml
obj.getName.bind(this)();//upupup
obj.getName.bind(otherObj)();//hml
- 箭头函数，在声明的时候绑定this，而非取决于调用位置，换句话说就是指向它的上一层。
//声明位置
var fn = (()=>{
console.log(this.x)
})
var x="2"
var obj={
x:"1",
fn:fn
}
//调用位置
obj.fn();//2
//调用位置
fn();//2
- 严格模式下，如果this没有被执行环境（execution context）定义，那this是为undefined。
"use strict";
var fn=function(){
return this
}
fn() ==undefined;//true
