关于this指向问题

全局环境下

在全局环境下this指向window

console.log(this===window)//true

 

在全局环境下指向window（严格模式是undefined）

 

函数上下文调用

 

1，直接调用

function aaa(){
    this===window
}

aaa()//true

 

结果为window（严格模式是undefined）

 

 

2，对象中的this

    a，this指向对象本身

    b，嵌套对象则指向最近的对象

let aaa={
    bb(){
        console.log(this)
    },
    cc:{
        dd(){
            console.log(this)
        }
    }
}

aaa.bb()//aaa
aaa.cc.dd()//aaa.cc

 

 

3，原型链中this

在原型链上this指向调用他的对象

 

4，构造函数中this

指向被其创建出来的对象

 

5，call  apply bind

call，apply，bind是都可以改变this指向的函数

会将函数的this指向这三个函数的第一个参数

function aa(b,c,d){
    console.log(b+c+d)
    console.log(this)
}

 

上述三个不同点在于

call在第一个参数之后的参数会一个一个放进函数内

aa.call(100,4,5,6)

　这里执行后this会指向100，而4,5,6的参数会逐一作为参数

 

apply与call基本相同，不一样的地方在于，参数一array的方式传递

aa.apply(100,[4,5,6])

 

 

bind与apply参数格式一致，但是他不会立刻执行，而是返回一个函数

aa.apply(100,[4,5,6])

 

 

 

6,DOM事件处理函数 与  内联事件中的 this

 

   DOM事件处理函数的this指向对应的dom块

    内联事件则分两种情况

<button onclick="console.log(this)"></button>

<button onclick="(console.log(this))()"></button>

 

分别指向对应的dom和指向window

 

 

 

7,setTimeout & setInterval

setTimeout与setInterval指向window

 

8，箭头函数

捕获其所在环境上下文的this值， 作为自己的this值，

但是要注意的一个问题

普通对象的箭头函数获取的this和实例对象获取的this是不一样的

 

普通函数

var pp={
    e:()=>{
        console.log(this)
    }
}

pp.e()//window

 

 

 

构造函数

function oo(){
    this.aa=()=>{
        console.log(this)
    }
    this.aa()
}
var cc=new oo()
//cc

cc.aa()
//cc

 

 

 

这其中的不同还暂未找到解释