平时用this有些混乱,所以写个总结。

没有箭头函数之前,我们说this就是函数运行时所在的环境对象,但是在箭头函数中this就是定义时所在的对象,先说大家熟知的:函数运行时所在的环境对象。

1、作为函数调用,this指向全局对象 

var q = 'window'
var func = function {
    console.log(this.q)
}

func()   //window

2、作为对象的方法调用,该对象即为调用上下文,this指向该对象。

var q = 'window'
var func = function() {
    console.log(this.q)
}

var obj = {
    q: 'obj',
    func: func,
    anotherObj: {
        q: 'anotherObj',
        func: func
    }
}

obj.func()   //obj
obj.anotherObj.func() //anotherObj

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

var q = 'window'

function Func() {
    this.q = 'Func'
    console.log(this.q)
}

var obj = new Func  //Func

console.log(this.q)  //window

4、通过函数的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

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。