javascript - 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"] 。由于小括号表示法采用字符串，因此您可以使用变量代替它。

另一个例子

   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但大多数人放弃窗口并直接引用全局范围。 EG window.alert与 alert 相同或window.requestAnimationFrame与 requestAnimationFrame 相同

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