Crafty.c()

public void Crafty.c(String name, Object component)

name: 组件名称

component: 包含组件属性和方法的对象

创建一个组件，其中第一个参数是id，第二个参数是将由实体继承的对象。

具体而言，每次将组件添加到实体时，组件属性都会复制到实体上。

这时原始数据类型(booleans, numbers, strings)的属性采用值拷贝。
这时复杂数据类型（objects,arrays,functions）的属性拷贝指向原始组件属性的引用。
(请参阅下方进一步解释的两个事例) 注意,当组件的方法被调用时 this关键字指向组件添加到的当前实体。

少数方法和属性可以使用特殊的方式指定，它们在特殊的上下文里被调用，（在它们的上下文里）并且不能被其他的组件覆盖。

required: 所需组件的字符串列表，它们将会在init()方法运行之前被添加。
init: 当组件添加到实体后将会被执行的函数
remove: 在组件被移除或实体被销毁之前调用的函数。它传递一个布尔参数，如果实体被销毁，它的值为true。
events: 其属性表示绑定到与属性名等效的事件的函数的对象。（见下面的例子）绑定在调用init之后直接发生，在remove调用前被直接删除。

除了这些硬编码的特殊方法，编写组件还有一些其他的约定：

以下划线开头的属性或方法被认为是私有的。
一个与组件同名的方法被认为是一个构造函数，通常需要在每个实体基础上向组件传递配置数据时使用。

例子

Crafty.c("Annoying", {
    _message: "HiHi",
    init: function() {
        this.bind("EnterFrame", function() { alert(this.message); });
    },
    annoying: function(message) { this.message = message; }
});

Crafty.e("Annoying").annoying("I'm an orange...");

使用 events 属性的方式代替添加 "EnterFrame" 事件:

Crafty.c("Annoying", {
    _message: "HiHi",
    events: {
        "EnterFrame": function(){alert(this.message);}
    }
    annoying: function(message) { this.message = message; }
});

注意

在上边的例子中，字段 _message是实体的本地属性。这意味着，如果你创建了很多实体，它们都具有这个属性并且可以有不同的值，因为它是一个简单类型，而简单类型是按值拷贝的。如果这个字段是一个对象或数组，它将在所有实体间共享，因为在javascript中复杂类型是按引用拷贝的。这可能不是你想要的，下边的例子将进行演示。

Crafty.c("MyComponent", {
    _iAmShared: { a: 3, b: 4 },
    init: function() {
        this._iAmNotShared = { a: 3, b: 4 };
    },
});

参见

Crafty.e