Example: Create Class Hierarchies with `extend`

Instantiate YUI

YUI().use('node', function(Y) {
    // This method is in the 'oop' module.  Since we require 'node'
    // for this example, and 'node' requires 'oop', the 'oop' module
    // will be loaded automatically.

Creating a class hierarchy

In this example, we create a class Bird then create a subclass Chicken.

function Bird(name) {
    this.name = name;
}

Bird.prototype.flighted   = true;  // Default for all Birds
Bird.prototype.isFlighted = function () { return this.flighted };
Bird.prototype.getName    = function () { return this.name };

function Chicken(name) {
    // Chain the constructors
    Chicken.superclass.constructor.call(this, name);
}
// Chickens are birds
Y.extend(Chicken, Bird);

// Define the Chicken prototype methods/members
Chicken.prototype.flighted = false; // Override default for all Chickens

instanceof many classes

Unlike classes composed with augmentation, subclasses created with extend are also considered instances of their superclass and all classes higher up the inheritance tree.

We'll create an instance of Chicken and run some instanceof and method tests against it.

function showInheritance() {
    var chicken = new Chicken('Little'),
        results = Y.one('#demo');

    results.setHTML('Running: ' + (new Date()));

    results.append(((chicken instanceof Object) ?
        "<p>chicken IS an instance of Object.</p>" :
        "<p>chicken IS NOT an instance of Object.</p>"));

    results.append(((chicken instanceof Bird) ?
        "<p>chicken IS an instance of Bird.</p>" :
        "<p>chicken IS NOT an instance of Bird.</p>"));

    results.append(((chicken instanceof Chicken) ?
        "<p>chicken IS an instance of Chicken.</p>" :
        "<p>chicken IS NOT an instance of Chicken.</p>"));

    // Chicken instances inherit Bird methods and members
    results.append(((chicken.isFlighted()) ?
        "<p>chicken CAN fly.</p>" :
        "<p>chicken CAN NOT fly.</p>"));

    results.append("<p>chicken's name is " + chicken.getName() + ".</p>");
}

Y.on('click', showInheritance, '#demo_btn');

Other architecture strategies

Take a look at augment and mix for different strategies of managing your code structure.

Full Source

YUI().use('node', function(Y) {

function Bird(name) {
    this.name = name;
}

Bird.prototype.flighted   = true;  // Default for all Birds
Bird.prototype.isFlighted = function () { return this.flighted };
Bird.prototype.getName    = function () { return this.name };

function Chicken(name) {
    // Chain the constructors
    Chicken.superclass.constructor.call(this, name);
}
// Chickens are birds
Y.extend(Chicken, Bird);

// Define the Chicken prototype methods/members
Chicken.prototype.flighted = false; // Override default for all Chickens


function showInheritance() {
    var chicken = new Chicken('Little'),
        results = Y.one('#demo');

    results.setHTML('Running: ' + (new Date()));

    results.append(((chicken instanceof Object) ?
        "<p>chicken IS an instance of Object.</p>" :
        "<p>chicken IS NOT an instance of Object.</p>"));

    results.append(((chicken instanceof Bird) ?
        "<p>chicken IS an instance of Bird.</p>" :
        "<p>chicken IS NOT an instance of Bird.</p>"));

    results.append(((chicken instanceof Chicken) ?
        "<p>chicken IS an instance of Chicken.</p>" :
        "<p>chicken IS NOT an instance of Chicken.</p>"));

    // Chicken instances inherit Bird methods and members
    results.append(((chicken.isFlighted()) ?
        "<p>chicken CAN fly.</p>" :
        "<p>chicken CAN NOT fly.</p>"));

    results.append("<p>chicken's name is " + chicken.getName() + ".</p>");
}

Y.on('click', showInheritance, '#demo_btn');


});