JavaScript中的this

最新推荐文章于 2024-10-02 23:06:10 发布

u013063153

最新推荐文章于 2024-10-02 23:06:10 发布

阅读量338

点赞数

CC 4.0 BY-SA版权

分类专栏： JavaScript

本文链接：https://blog.youkuaiyun.com/u013063153/article/details/52848312

JavaScript 专栏收录该内容

82 篇文章

订阅专栏

本文深入探讨了JavaScript中this关键字的指向问题，通过多个实例详细解释了this如何根据调用上下文变化而变化，并讨论了在不同情况下this的具体指向。

例1：

function a(){
    var user = "yao";
    console.log(this.user);//undefined
    console.log(this);//window
}
a();

等价于：

function a(){
    var user = "yao";
    console.log(this.user);//undefined
    console.log(this);//window
}
window.a();

this指向的是window。

例2：

var o =  {
    user:"yao",
    fn:function () {
        console.log(this.user);//yao
    }
}
o.fn();

this指向的是o。

例3：

var o = {
    user:"yao",
    fn:function () {
        console.log(this.user);//yao
    }
}
window.o.fn();

this指向的是o。

var o = {
    a:10,
    b:{
        a:12,
        fn:function () {
            console.log(this.a);//12
        }
    }
}
o.b.fn();

this指向的是b。

例4：

var o = {
    a:10,
    b:{
        a:12,
        fn:function () {
            console.log(this.a);//undefined
            console.log(this);//window
        }
    }
};
var j = o.b.fn;
j();

综上所述：

this的指向永远是最终调用它的对象。

当this遇上函数的return：

例5：

function fn(){
    this.user = "yao";
    return {};
}
var a = new fn;
console.log(a.user);//undefined

例6：

function fn(){
    this.user = "yao";
    return function(){};
}
var a = new fn;
console.log(a.user);//undefined

例7：

function fn(){
    this.user = "yao";
    return 1;
}
var a = new fn;
console.log(a.user);//yao

例8：

function fn(){
    this.user = "yao";
    return undefined;
}
var a = new fn;
console.log(a.user);//yao

this指向的是函数返回的那个对象。

function fn(){
    this.user = "yao";
    return null;
}
var a = new fn;
console.log(a.user);//yao

虽然：null是对象，但是此时this指向的仍然是函数的实例。

PS：

在"use strict"模式下，this默认的指向是undefined，而不是window。