Javascript 在不使用函数获取对象的情况下访问对象内部的对象？

我想访问一个对象，但不知道如何访问。 我想访问“ctx”，但使用base.ctx总是返回null这是闭包吗

window.base = function () {

    var c = null,
        ctx = null;

    window.addEventListener("load", function(){
        c = document.getElementById("canvas");
        ctx = c.getContext("2d");
    }

}

我发现解决方案是调用base中返回ctx的函数

window.base = function () {

    var c = null,
        ctx = null;

    window.addEventListener("load", function(){
        c = document.getElementById("canvas");
        ctx = c.getContext("2d");
    }

    return {
        ctx: function(){return ctx;}
    };

}

然后我可以访问ctx，但现在我所有的访问都需要：

base.ctx().setStyle = "white";

而不是我想要的是：

base.ctx.setStyle = "white";

可能吗？我在想有一个可能的解决方案是使用'this'/scope或其他什么，但我还不知道足够的JavaScript。

base是一个函数

像这样使用它：

base().ctx()

我将用以下方式编写您的代码：

window.addEventListener('load', function () {
    var base = function () {
        return document.getElementById("canvas").getContext("2d");
    }

    // Do something with base()
});

您也可以删除该函数，只使用上下文：

window.addEventListener('load', function () {
    var base = document.getElementById("canvas").getContext("2d");
    // Do something
});

---

对我来说，答案是将这些值存储在一个名为inter的对象中，然后更新该对象的内容——这些更改对其他代码是可见的

因此，我可以使用： base.ctx.fillStyle=白色

我不知道为什么另一种方法不起作用

var base = function () {

var fps = 60,
    canvasWidth = 300,
    canvasHeight = 200,
    scaling = 1;

function updateCanvas(){
  ctx.putImageData(imageData, 0, 0);
}

var c = null,
    cStyle = null,
    updateGraphicsCallBack = null;

function initialiseCanvas(canvasName, theCallBack){
    updateGraphicsCallBack = theCallBack;
    c = document.getElementById(canvasName);
    cStyle = c.style;
    inter.ctx = c.getContext("2d");
    inter.imageData = inter.ctx.getImageData(0, 0, canvasWidth, canvasHeight);
    inter.imageArray = inter.imageData.data;
    inter.buff8 = new Uint8ClampedArray(inter.imageArray.buffer);
    inter.buff32 = new Uint32Array(inter.imageArray.buffer);

    cStyle.width = canvasWidth * scaling + "px";
    cStyle.height = canvasHeight * scaling + "px";
    c.width = canvasWidth;
    c.height = canvasHeight;
    inter.ctx.imageSmoothingEnabled = true;
    inter.ctx.fillStyle="#909090";

    //mouse = (typeof window.mouseInit !== "undefined") ? window.mouseInit(c) : null;
    //if(typeof window.db !== "undefined") window.db.setOutput("debugOutput");

    requestAnimationFrame(drawLoop);
}

var oldTimeStamp = 0, timeTweak = 0;
function drawLoop(currentTimeStamp) {
    currentTime = currentTimeStamp;

    if(typeof timeChart !== "undefined") timeChart.start();  

    setTimeout(
        function() {
            requestAnimationFrame(drawLoop);
        }, (1000 - ((currentTimeStamp - oldTimeStamp) - timeTweak)) / fps);

    updateGraphicsCallBack(currentTimeStamp);

    if(typeof timeChart !== "undefined") {
        timeChart.end();
        if(timeChart.currentFrameCount() > -1){
            var difference = timeChart.currentFrameCount() - fps;
            timeTweak += difference;
            if(timeTweak<-10000) timeTweak = -10000;
            if(timeTweak>10000) timeTweak = 10000;
        }
        inter.timeTweak = timeTweak;
    }

    oldTimeStamp = currentTimeStamp;
}

var inter = {
    updateCanvas: updateCanvas,
    ctx: null,//function(){return ctx;},
    canvasWidth: canvasWidth,
    canvasHeight: canvasHeight,
    fps: fps,
    scaling: scaling,
    imageData: null,
    imageArray: null,
    buff8: null,
    buff32: null,
    timeTweak: timeTweak,
    initialiseCanvas: initialiseCanvas
};

return inter;

}();

---

为什么yiu使用window而不是var obj={}obj.ctx=function更大的问题是，由于ctx是异步填充的，所以您很容易遇到竞争条件。@Scopi:我会更改它，谢谢。@deceze:我不知道！谢谢你让我知道。谢谢！如果base是自调用的，有没有一种方法可以访问ctx而不使用函数获取其当前值？