Question

我正在学习JavaScript而且我正在玩html5 canvas api。因为我首先必须创建canvas元素，而不是获得2d / 3d上下文（这是2个未连接的变量），所以创建将这两者合并为一个的东西似乎是合乎逻辑的。

想法是让图形（gfx）对象（实际上是上下文对象）和graphics.canvas引用canvas元素，这样我就可以做gfx.fillRect(0,0,150,75);之类的事情了使用gfx.canvas.width = x;等尺寸画布...

当我尝试创建构造函数时，它并没有真正解决，我提出了一个解决方案，以context作为属性返回canvas对象，但我不确定是否这是正确的方法。

解决此问题的最佳方法是什么？

这是我的代码：

function Canvas (context, width, height) {
    var canvas = document.createElement('canvas'),
    contex = canvas.getContext(context);

    this = contex; // <<-- Getting error here
    this.canvas = canvas;

    this.canvas.width = width;
    this.canvas.height = height;

    this.append = function () {
        document.body.appendChild(this.canvas);
    };
}

function Canvas2 (context, width, height) {
    var canvas = document.createElement('canvas'),
    contex = canvas.getContext(context);

    contex.canvas = canvas;

    contex.canvas.width = width;
    contex.canvas.height = height;

    contex.append = function () {
        document.body.appendChild(this.canvas);
    };

    return contex;
}

var gfx = new Canvas('2d', 400, 400),
gfx2 = Canvas2('2d', 400, 400);

gfx.append();
gfx2.append();

Answer 1

this是JavaScript中的保留字，指的是只读上下文变量。你无法重新分配它。

如果没有理由你不能继续使用contex变量，那么就这样做。如果您需要创建一个局部变量，那么将其命名为：

var that = contex;

Answer 2

使用ES2015，你可以做到

for key in dict.keys():
    if dict[key] == 'X':
        print key

在JavaScript构造函数中指定'this'的值

2 个答案: