关于this指向的一些梳理

发布于:2023-03-13 ⋅ 阅读:(714) ⋅ 点赞:(0)

函数内

非严格模式

通常情况下,定义的函数的this就是window,比如:

function doit(){
    console.log(this);
}

doit();

打印结果:

Window {window: Window, self: Window, document: document, name: '', location: Location, …}

严格模式

不过,如果开启了严格模式:

"use strict"

function doit(){
    console.log(this);
}

doit();

打印结果:

undefined

箭头函数

不过,如果严格模式下改为箭头函数,打印结果就还是window:

"use strict"

var doit = ()=>{
    console.log(this);
}

doit();

对象中

普通函数

总结起来就是:谁调用我,我指向谁。比如我们现在有一个json如下:

var obj = {
    key1: {
        key2: {
            doit: function () {
                console.log(this);
            },
            key3: {
                doit: function () {
                    console.log(this);
                }
            }
        }
    }
};

那么,执行下面语句:

obj.key1.key2.doit();

打印结果就是:

{key3: {…}, doit: ƒ}

因为调用我的是obj.key1.key2,所以this就是它。而执行下面的语句:

obj.key1.key2.key3.doit();

打印结果就是:

{doit: ƒ}

同理,此时this就是obj.key1.key2.key3。

接收一下

如果下面这样先存一下再调用:

var doit=obj.key1.key2.doit;
doit();

打印结果如下:

Window {window: Window, self: Window, document: document, name: '', location: Location, …}

箭头函数

这里情况其实变得更简单了,this永远指向当前作用域中的this。

比如我们把上面的json改造一下:

var obj = {
    key1: {
        key2: {
            doit: ()=> {
                console.log(this);
            },
            key3: {
                doit: ()=> {
                    console.log(this);
                }
            }
        }
    }
}

那么对于下面的语句:

obj.key1.key2.doit();
obj.key1.key2.key3.doit();

那么打印结果就是:

Window {window: Window, self: Window, document: document, name: '', location: Location, …}
Window {window: Window, self: Window, document: document, name: '', location: Location, …}

由于json定义在全局作用域上,所以this就是window。

柯理化函数

比如我们有如下一个json:

var json = {
    doit: function () {
        return function () {
            console.log(this);
        };
    }
};

打印结果:

Window {window: Window, self: Window, document: document, name: '', location: Location, …}
本文含有隐藏内容,请 开通VIP 后查看