This is an update to Object Instantiation in AFrameJS – Now Simplified, which is an update to AFrameJS Tutorial – A Response to “Backbone.js Tutorial – by noob for noobs”. Object instantiation has gotten even simpler - again. Every "class" that is created using AFrame.Class or AFrame.extend and that has an init function will have a "create" function attached as a static class member. The attached create function will call AFrame.create with the class constructor. The advantage is less but more readable code.

The Old Way

// Instantiating a plain AFrame.AObject.
var instance = AFrame.create( AFrame.AObject );

The New Way

// A few less bytes, but way more readable.
var instance = AFrame.AObject.create();

Options can be passed along to the create function, as shown in the next example.

Fuller Example

A working example can be found at JSFiddle

// HTML used
<button id="submitButton">Submit Button</button>


    // Create a button class listening for a click
var Button = AFrame.Class(AFrame.Display, {
    domevents: {
        click: function(event) {
            alert('button clicked');

var button = Button.create({
    target: '#submitButton'

The final example from Object Instantiation in AFrameJS – Now Simplified is shown here, updated for this change:

Reworking the "Add Friend" Example

A working example can be found on JSFiddle.
$( function() {
// Instead of creating a model, create a SchemaConfig.
// A Model in AFrame is an instance of data combined
// with a Schema.  The schema config will be used when
// creating the model.
var friendSchemaConfig = {
    name: { type: 'text' }

// Our friends collection is an array.  Instead of binding
// directly to an event on the collection, when creating
// the list, we bind the list to the collection.
// The ListPluginBindToCollection will take care of
// updating of the list.
var friendsCollection = AFrame.CollectionArray.create( {
    plugins: [ [ AFrame.CollectionPluginModel, {
         schema: friendSchemaConfig
    } ] ]
} );

// This is the friends list.  It is bound to the
// friendsCollection, so any time a model is added or
//  removed from the friends collection, the list will update.
var friendsList = AFrame.List.create( {
    target: '#friendList',
    listElementFactory: function( model, index ) {
        return AFrame.DOM.createElement( 'li',
            model.get( 'name' ) );
    plugins: [ [ AFrame.ListPluginBindToCollection, {
         collection: friendsCollection
    } ] ]
} );

// we insert into the friendsCollection once we
// have a name.  The list will be updated automatically.
$( '#add-friend' ).click( function( event ) {
       var friend_name = prompt("Who is your friend?");
       // A new model will be created when adding
       // to the friend collection.
       friendsCollection.insert( { name: friend_name } );
} );

} );

Read Object Instantiation in AFrameJS – Now Simplified to see more examples of the various ways to create an object.