0

好的，所以 Javascript 是一种“原型”语言，据我了解，这意味着它具有以下内容：

var c = document.getElementById('myCanvas');
c.ctx = c.getContext('2d');

现在，如果我这样做：

var c = document.getElementById('myCanvas');
c.ctx = c.getContext('2d');
c = document.getElementById('newCanvas');

c.ctx 会在影响全新画布的同时保留并发挥作用吗？谢谢！

我的实验说不，但我问，因为也许我错过了一些东西。如果理论上这不应该工作，你有什么好方法可以相对容易地绕过它吗？（或者不那么容易，但容易是当然的偏好！）

4

3 回答 3

2

会c.ctx在影响全新画布的同时保持并发挥作用吗？

不，您正在为c.

所以 Javascript 是一种“原型”语言

那么为什么不在原型中定义你想要的呢？

Object.defineProperty(
    HTMLCanvasElement.prototype,
    'ctx',
    {
        'get': function () { return this.getContext('2d'); },
        'configurable': true
    }
);

现在所有<canvas>通过 DOM 接口访问的元素都会有一个属性ctx来获取它们的上下文。

如果您对缓存的上下文感到满意，则可以改用它

function () { return this.ctx = this.getContext('2d'); }

它在实例上设置了一个新属性，该属性会影响原型的 getter。

于 2013-10-20T02:40:42.787 回答
1

当你分配这个：

c = document.getElementById('newCanvas');

c您正在用对新对象的引用替换整个变量。前一个对象的任何先前属性都c不会保留。

于 2013-10-20T02:35:14.320 回答
0

在您的代码中

var c = document.getElementById('myCanvas');
c.ctx = c.getContext('2d');
c = document.getElementById('newCanvas');

在最后一行，您只是覆盖了 c 变量。

你可以把它想象成运行这个

var c = document.getElementById('myCanvas');
c.ctx = c.getContext('2d');
c = 3;

假设您编写的代码实际上意味着什么：不过您很幸运，ctx 内置了一个画布引用（这与您想要的相反，但它是相同的交易）

ctx.canvas;
于 2013-10-20T02:35:30.330 回答