javascript - js this上下文问题

问题描述

问 题

(function(){
    var obj = {
        a:{
            a1:function(){console.log('hello world!')}
        },
        b:{
            b1:function(){
                console.log(this); // 此时this是obj.b
                //如何让this指代obj来调用a.a1?
                //莫非只能写obj.a.a1()来调用?
            }
        },
    };
    obj.b.b1();
})();

在obj.b.b1上下文环境中，请问如何能调用到a.a1()？

解决方案

obj对象下的a和b是两个独立的对象，内部this会分别绑定到a和b下面，是相互独立的，只能通过改变this指向或者使用缓存的方式来解决。

改变this指向,声明时无需任何改动，但每次调用时都需要手动改变this绑定：

obj.b.b1.call(obj.a) // 或者obj.b.b1.apply(obj.a)

使用缓存，声明时比较麻烦，但调用时无需额外代码：

var obj = (function _this(){
    return {
        a:{
            a1:function(){console.log('hello world!')}
        },
        b:{
            b1:function(){
                _this().a.a1();
            }
        },
    };
})();
obj.b.b1(); // console.log('hello world!');

虽然缓存比较麻烦，但是比直接用obj.a.a1()要安全很多。

这篇关于javascript - js this上下文问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！