每日一题（二二）var fullname = 'a'; var obj = { fullname: 'b', prop : { fullname: 'c'

JS this指向详解

最新推荐文章于 2025-06-26 12:04:21 发布

原创最新推荐文章于 2025-06-26 12:04:21 发布 · 1.3k 阅读

7 ·

CC 4.0 BY-SA版权

文章标签：

#this指向 #JS基础 #前端面试题 #每日一题 #javascript

温故知新专栏收录该内容

95 篇文章

订阅专栏

本文深入解析JavaScript中this关键字的指向规则，通过具体示例代码解释不同调用方式下this指向的变化，包括作为对象属性调用、全局作用域下直接调用、使用new关键字调用以及使用call、apply、bind强绑定调用。

题目描述：写出执行结果并解释原因

var fullname = 'a';
var obj = {
    fullname: 'b',
    prop : {
        fullname: 'c',
        getFullname: function(){
            return this.fullname;
        }
    }
};
console.log(obj.prop.getFullname());
var test = obj.prop.getFullname;
console.log(test());

答案：

c
a

解析：

原因在于 this 指向的是函数的执行环境， this 取决于其被谁以哪种方式调用了，而不是被谁定义了。
对第一个 obj.prop.getFullname() 而言，getFullname() 是作为 obj.prop 对象的一个方法调用的，因此此时的执行环境应该是这个对象。
obj.prop.getFullname 被分配给 test 变量时，此时的执行环境变成了全局对象（window）,原因是 test 是在全局作用域下定义的。因此，此时 this 指向的是全局作用域的 fullname 变量，即 a

this 指向取决于函数被谁以何种方式调用的，一般分为四种方式

被当作对象的属性调用，this 指向调用对象，例如上面的 obj.prop.getFullname()
在全局作用域下直接调用，即 fn()，例如上面 test = obj.prop.getFullname; test()。这里 test 就是直接调用。
使用 new 关键字调用，this 指向新生成的实例对象
使用 call、apply、bind 强绑定调用，this 指向绑定对象