JavaScript inheritance with jQuery - calling parent function

Question

Is there a better method for merging two objects and calling parent functions?

var a = {
   a:1,
   myFunction:function(){
       console.info("a");
   }
}

var b = {
    b:2,
    myFunction:function(){
        console.info("b");
        this.callParent();
    }
}

var obj = {};
$.extend(obj, a);
$.extend(obj, b);
b = obj;
b.superclass = a;

wrapping all functions so "this.callParent" is present

function wrap(func, parent) {
    return function() {
        this.callParent = parent;
        var result = func.apply(this, arguments);
        return (this.callParent), result;
    };
}

with an iteration such as:

$.each(b, function(key, value){
        if(typeof value == "function" && b.superclass && b.superclass[key]){
            b[key] = wrap(value, b.superclass[key]);
        }
});

with an output "b -> a":

b.myFunction();

Demo

Answer 1

Is there a better method for merging two objects and calling parent functions?

Yes, doing it in one step with a single helper function, instead of that flubbed way with $.extend.

Notice that jQuery's extend function does not really set up any inheritance, it just can be used for mixins - you shouldn't use the term "inheritance" within reference to that. Also, your objects a and b are definitely no "classes", so please don't name it .superclass. They're singletons at best.

You can do inheritance in the way you suggested, but notice it is not prototypical inheritance as one would expect in JavaScript.

function inheritObject(parent, child) {
    for (var p in parent)
        if (!(p in child))
            child[p] = parent[p]; // extend
        else if (typeof child[p] == "function") (function(name, fn) {
            child[name] = function() { // inherit
                this.callParent = parent[name];
                var res = fn.apply(this, arguments);
                delete this.callParent;
                return res;
            };
        }(p, child[p]));
    return child;
}

var a = {
   a:1,
   myFunction:function(){
       console.info("a");
   }
}

var b = inheritObject(a, {
    b:2,
    myFunction:function(){
        console.info("b");
        this.callParent();
    }
});