Question

我对javascript和画架js有一个非常奇怪的问题。

我正在使用easel.js库，并且我已经相当深入地使用它构建了一个项目。

我试图拥有一个'类'（我知道它们在技术上不是javascript中的类，但是我会使用这个术语缺少一个更好的词）从easel js继承Shape类，然后让另一个类继承那。所以它会是这样的：

easeljs.Shape - ＆gt; MenuButton - ＆gt; BuildingButton

我使用的代码如下所示：

BuildingButton.prototype = Object.create(MenuButton.prototype);
BuildingButton.prototype.constructor = BuildingButton;

function BuildingButton(){
    MenuButton.call(this);
}

MenuButton.prototype = Object.create(createjs.Shape.prototype);
MenuButton.prototype.constructor = MenuButton;

function MenuButton(){
    createjs.Shape.call(this);
}

问题是我的代码出现以下错误：

Uncaught TypeError: undefined is not a function 
easeljs-0.7.1.combined.js:8439

（第8439行指向Shape（）构造函数中的initialize（）函数。）

现在这是奇怪的事情。如果我改变定义的顺序，以便第二个而不是第一个定义子类，它可以正常工作！

MenuButton.prototype = Object.create(createjs.Shape.prototype);
MenuButton.prototype.constructor = MenuButton;

function MenuButton(){
    createjs.Shape.call(this);
}

BuildingButton.prototype = Object.create(MenuButton.prototype);
BuildingButton.prototype.constructor = BuildingButton;

function BuildingButton(){
    MenuButton.call(this);
}

这非常令人困惑，因为我似乎无法弄清楚为什么地球上会发生这种情况。我可以确保我以正确的顺序定义它们并保留它，但我将所有'类'放在不同的源文件中，然后由grunt串联起来，按字母顺序排列。另外，我觉得我对javascript的知识可能有很大的差距（或者也许是easel.js我不确定究竟是什么导致了这种行为）。

先谢谢你的帮助，我希望这个问题有道理！

Answer 1

MenuButton.prototype = Object.create(createjs.Shape.prototype);
…
BuildingButton.prototype = Object.create(MenuButton.prototype);

这两个语句具有明确的依赖关系，需要以正确的顺序执行（对于函数声明，如果放在同一个范围/文件中，则顺序无关紧要，但如果在不同的文件中，则需要加载正确的顺序/文件很明显。）

我把所有'类'放在不同的源文件中，然后由grunt串联起来，按字母顺序排列

这不是个好主意。您应该使用一些允许声明依赖项的构建工具/脚本。

Answer 2

阅读本文以清除问题：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain

在第一个示例中，您尝试从无任何继承，因为尚未定义MenuButton.prototype。为了使其正常工作，只需添加MenuButton.prototype = new createjs.Shape.prototype（而不是Object.create()，不再使用它），在您使用它之前先将其实例化。你的第一个代码就像你愿意吃香蕉一样。

奇怪的JavaScript行为 - 错误除非＆＃39;类＆＃39;以正确的顺序定义

2 个答案: