javascript - javascript: オブジェクトを持つパブリック配列

Question

(私の英語で申し訳ありません=/) 「onload」時に配列を作成します。

（これ：

var $ = {
    ratio: 0.7,
    screen: 500,
    margin: 10,
    canvas: document.getElementById("canvas"),
    ctx: document.getElementById("canvas").getContext("2d"),
}

and $.canvasand$.ctxは 'null' を与えます。書き直せばこの作品

...
canvas: function(){return document.getElementById("canvas")}
...

しかし、これを呼び出したい場合、変数は次のようになります $.canvas () '()'なしでこの変数を作成するにはどうすればよいですか???

Answer 1

これを試して：

window.onload = function(){
    window.$ = {
        ratio: 0.7,
        screen: 500,
        margin: 10,
        canvas: document.getElementById("canvas"),
        ctx: document.getElementById("canvas").getContext("2d"),
    }
}

Answer 2

$変数のスコープに問題があるようです。var関数内でキーワードを使用して宣言することによりwindow.onload、そのスコープはローカル関数であり、グローバルスコープではありません。

代わりに、onload関数の外部で定義できます。

var $; // in the global scope

window.onload = function(){
    $ = {
        ratio: 0.7,
        screen: 500,
        margin: 10,
        canvas: document.getElementById("canvas"),
        ctx: document.getElementById("canvas").getContext("2d")
    };

    console.log($.canvas);
    console.log($.ctx);
};

グローバルスコープで宣言することにより、onload関数の外部からアクセスできます。

フィドル