HTML5, CSS3 & JS Experiments

By Martin Ivanov

Inheritance Without Constructors

Demo

Open your browser's console and reload the page to see the code in action.

Register the Class

<script src="Extend.js"></script>
<script src="Example.js"></script>

Usage and Code Insight

(function() {
    // base object
    var
        base = {
            props: {
                firstName: "Martin",
                lastName: "Ivanov",
                web: {
                    site: "http://wemakesites.net",
                    blog: "http://acidmartin.wordpress.com/",
                    ui: "http://acidmartin.wordpress.com/",
                    twitter: "https://twitter.com/#!/wemakesitesnet"
                }
            },

            init: function() {
                window.console.log(">>> base.init()");
            },

            getProperties: function() {
                return this.props;
            }
        };

    // directly call base method if required
    base.init();

    // inheriting object with some default methods
    var 
        subclass = {
            ownMethod: function() {
                window.console.log(">>> subclass.ownMethod()");
            }
        };

    // extend the subclass with properties from the base object
    extend(base, subclass);

    // call some methods from the subclass
    subclass.init();
    subclass.ownMethod();
    window.console.log(subclass.getProperties());    
})();
/*
 * extend
 * Simple JavaScript extender
 * developer's website: http://wemakesites.net/#!/web-dev
 * developer's twitter: https://twitter.com/#!/wemakesitesnet
 * developer's blog http://acidmartin.wordpress.com/
 **/
(function() {
    "use strict";
    
    function extend(superclass, subclass) {
        for(var key in superclass) {
            if(superclass.hasOwnProperty(key)) {
                subclass[key] = superclass[key];
            }
        }
    }
    
    window.extend = extend;
})();