CocosCreator cc.class声明类

定义类

var Sprite = cc.Class({
    name: "sprite"
});
var obj = new Sprite();

• 定义的类的类型名为 Sprite 可以用 new 构造一个对象。
• 也可以不定义类名，直接构造类。

构造函数——ctor/ __ ctor__

ctor 不允许含有参数，如果构造时需要用到参数，必须使用__ctor__

var Sprite = cc.Class({
    ctor: function () {
        cc.log(this instanceof Sprite);    // true
    }
});

继承——extends

// 父类
var Shape = cc.Class();

// 子类
var Rect = cc.Class({
    extends: Shape
});

父类构造函数

• 不论子类是否有定义构造函数，子类实例化前父类的构造函数都会被自动调用。
• 不需要尝试调用父类的构造函数，否则父构造函数就会重复调用。
• 在一些很特殊的情况下，父构造函数接受的参数可能和子构造函数无法兼容。这时开发者就只能自己手动调用父构造函数并且传入需要的参数，这时应该将构造函数定义在__ ctor__中。

var Node = cc.Class({
    ctor: function () {
        this.name = "node";
    }
});
var Sprite = cc.Class({
    extends: Node,
    ctor: function () {
        // 子构造函数被调用前，父构造函数已经被调用过，所以 this.name 已经被初始化过了
        cc.log(this.name);    // "node"
        // 重新设置 this.name
        this.name = "sprite";
        
        Node.call(this);        // 别这么干！
        this._super();          // 也别这么干！
    }
});
var obj = new Sprite();
cc.log(obj.name);    // "sprite"

属性声明

• Cocos 类中，将声明的属性放在 properties 中，分简单声明和完整声明。

• 简单声明：

  • 当声明的属性为基本 JavaScript 类型时，可以直接赋予默认值
  • 当声明的属性具备类型时（如：cc.Node，cc.Vec2 等），可以在声明处填写他们的构造函数来完成声明
  • 当声明属性的类型继承自 cc.ValueType 时（如：cc.Vec2，cc.Color 或 cc.Rect），除了上面的构造函数，还可以直接使用实例作为默认值
  • 当声明属性是一个数组时，可以在声明处填写他们的类型或构造函数来完成声明

  properties: {
      height: 20,       // number
      type: "actor",    // string
      loaded: false,    // boolean                
      target: null,     // object
      
      target: cc.Node,
      pos: cc.Vec2,
   
      pos: new cc.Vec2(10, 20),
      color: new cc.Color(255, 255, 255, 128),
      
      any: [],      // 不定义具体类型的数组
      bools: [cc.Boolean],
      strings: [cc.String],
      floats: [cc.Float],
      ints: [cc.Integer],
  
      values: [cc.Vec2],
      nodes: [cc.Node],
      frames: [cc.SpriteFrame],
  }
  

• 完整声明

  • 有些情况下，我们需要为属性声明添加参数，这些参数控制了属性在属性检查器中的显示方式，以及属性在场景序列化过程中的行为
  • 常见属性：
    • default: 设置属性的默认值，这个默认值仅在组件第一次添加到节点上时才会用到
    • type: 限定属性的数据类型
    • visible: 设为 false 则不在 属性检查器 面板中显示该属性
    • serializable: 设为 false 则不序列化（保存）该属性
    • displayName: 在 属性检查器 面板中显示成指定名字
    • tooltip: 在 属性检查器 面板中添加属性的 Tooltip

  properties: {
  	score: {
      	default: 0,
      	displayName: "Score (player)",
       	tooltip: "The score of player",
  	}
  }
  

注：可以在 onLoad 函数中用 this 设置属性，防止变量在属性检查器中赋值后无法改变。

静态变量

静态变量或静态方法可以在原型对象的 statics 中声明：

var Sprite = cc.Class({
    statics: {
        // 声明静态变量
        count: 0,
        // 声明静态方法
        getBounds: function (spriteList) {
            // ...
        }
    }
});

重写

• 子类方法可以直接重写父类方法
• 用 this._super 调用父类成员

var Shape = cc.Class({
    getName: function () {
        return "shape";
    }
});
var Rect = cc.Class({
    extends: Shape,
    getName: function () {

        var baseName = this._super();

        return baseName + " (rect)";
    }
});
var obj = new Rect();
cc.log(obj.getName());    // "shape (rect)"