EaselJS 中的动态舞台名称

Question

我目前正在开发一个旨在同时显示多个 canvas 的网站，但不知道它会提前显示哪个 canvas（一个 PHP脚本创建列表）。

想法是让多个脚本文件（每个 canvas 一个）由（通常）单个处理程序读取，该处理程序将填充各个阶段。

stage = new createjs.Stage(context);

我被困在这里了。在我创建给定阶段时，我知道我想要将其附加到的 canvas 的名称（例如，stageA），并且它在名为 context 的变量中的 JavaScript 中可用。在这种情况下，我需要创建一个名为 stageA 的 easeljs 舞台；问题是我无法提前知道我不需要 stageB 而不是 stageA 所以创建的阶段的名称需要是动态的（等于上下文）。我尝试了一些类似

的方法

eval(context) = new createjs.Stage(context);

但它无法正常工作。

（我还需要能够在这个动态命名的舞台上进行操作，即能够做到

stageA.update();

例如，不知道 stageA 被称为 stageA，但只是基于上下文。）

有什么建议吗？

Answer 1

您可以对全局变量使用括号表示法 windows["stageA"] 或者如果您知道自己在全局范围内 this["stageA"]

因此，如果您在全局范围内有一个上下文并且您有一个带有其变量名的字符串，那么您可以像这样通过括号表示法访问它

var stageA = // context of canvas
var stageName = "stageA"
var theStage = window[stageName];

现在 theStage 引用 stageA。

theStage.clearRect(0,0,100,100); 
// same as
stageA.clearRect(0,0,100,100);

所有对象属性都可以通过点符号即window.alert或括号符号即window["alert"]访问.由于 braket 表示法采用字符串，您可以在其位置使用变量。

另一个例子

   var myObj = {
       attributeA : 10,
   }
   console.log(myObj.attributeA); // output 10;
   console.log(myObj["attributeA"]); // output 10;
   var attributeName  = "attributeA";
   console.log(myObj[attributeName]); // output 10;

全局作用域称为window，但大多数人放弃window并直接引用全局作用域。 EG window.alert 等同于 alert 或者 window.requestAnimationFrame 等同于 requestAnimationFrame

全局范围也称为 this，但您需要知道您处于全局范围内。如果您有信心，那么 this["alert"] 或 window["alert"] 或 alert 或 window.alert 或 this.alert 在全局范围内都是相同的引用。

EaselJS 中的动态舞台名称

Dynamic Stage name in EaselJS

html

javascript

canvas

easeljs

createjs