2

我正在尝试学习如何创建 createjs 对象。

我正在调查 createjs/tutorials/Inheritance/demo.html 和 Button.js

(function() {
var Button = function(label, color) {
  this.initialize(label, color);
}
var p = Button.prototype = new createjs.Container(); // inherit from Container

p.label;
p.background;
p.count = 0;

*p.Container_initialize = p.initialize;*
Button.prototype.initialize = function (label, color) {

    *this.Container_initialize();*

    this.label = label;
    if (!color) { color = "#CCC"; }

    var text = new createjs.Text(label, "20px Arial", "#000");
    text.textBaseline = "top";
    text.textAlign = "center";

    var width = text.getMeasuredWidth()+30;
    var height = text.getMeasuredHeight()+20;

    this.background = new createjs.Shape();
    this.background.graphics.beginFill(color).drawRoundRect(0,0,width,height,10);

    text.x = width/2;
    text.y = 10;

    this.addChild(this.background,text); 
    this.addEventListener("click", this.handleClick);  
    this.addEventListener("tick", this.handleTick);
} 

p.handleClick = function (event) {    
    var target = event.target;
    alert("You clicked on a button: "+target.label);
} 

p.handleTick = function(event) {       
    p.alpha = Math.cos(p.count++*0.1)*0.4+0.6;
}

window.Button = Button;
}());

有一个自调用函数 this.Container_initialize(); 我试图将其注释掉，这使代码无法正常工作。有人可以解释 Container_initialize 函数的作用吗？那是无限循环吗？

4

1 回答 1

2

这不是一个无限循环，正在发生的事情是您正在制作旧初始化的“副本”（实际上只是一个新的引用）。

p.Container_initialize = p.initialize;

这里，p.initialize与 相同createjs.Container.prototype.initialize。当你写：

Button.prototype.initialize = function(...) {

您正在覆盖Container.prototype.initialize，但由于您将其保存在 中，Container_initialize您仍然可以调用它。

至于函数的作用，那是阅读源代码的问题，它可能会设置容器对象所需的任何内部内容。这就是为什么你不能不调用它的原因。

于 2013-04-25T19:46:47.863 回答