使用＆＃34; context＆＃34;

Question

使用html5的canvas元素时，我总是看到以下类型的代码：

canvas = document.getElementById("id")
ctx = canvas.getContext("2d")  /* or may be 'webgl' or something else */
ctx.moveTo()
...
ctx.lineTo()
...
blabla...

我想知道为什么我们在这里需要context对象：不会更直接地写

canvas.moveTo()
canvas.drawImage()
canvas.render()

我无法看到创建名为context的额外内容的必要条件。我看到一个解释说它是因为有几个上下文，如'2d'，'webgl' ...他们使用不同的绘图方法，画布必须知道使用哪个。但我对此解释并不满意，因为我们可以像canvas一样向canvas.set_method('2d')添加属性。必须有一些复杂的理由来使用上下文管理器而不是普通的画布。 任何人都可以帮我澄清一下吗？

Answer 1

可能要明确区分不同上下文的API和画布的常用功能。

不同的上下文是不同的API - 它们具有不同的功能集。如果要在画布上直接调用这些函数，那么 画布必须能够接受所有这些不同的功能，并且在使用时允许哪些功能会令人困惑;和他们 将与可以使用的函数混合在一起，无论上下文如何。

Tim Berners-Lee在2008年撰写的

This article讨论了模块化问题 并恰巧提到画布和上下文。它讨论了拆分2d上下文API（我认为这只是意味着将它放入一个单独的规范中）。如果上下文API是画布的一部分，这将是不方便的。