Question

I have a class definition method for create class in javascript:

var Class = function() {
    var clazz = null,
    pros = {};
    for (var i = 0; i < arguments.length; i++) {
        var arg = arguments[i];
        if (typeof arg == "function") arg = arg.prototype;
        else {
            arg.init && (clazz = arg.init, delete arg.init)
        }
        for (var p in arg) pros[p] = arg[p];
    }
    clazz.prototype = pros;
    return clazz;
};

var Person = Class({
    init: function(name) {
        this.name = name;
    },
    say:function(){
        console.info(this.name);
    }
});

var Man = Class(Person, {
    init: function(name) {
        Person.apply(this, arguments);
        this.gender = 'man'
    }
});

var m = new Man('kk');
console.info(m instanceof Man);
console.info(m instanceof Person);

However, it does not support the instanceof operator.

Any idea to fix it?

Answer 1

You should keep track of the prototype chain to make instanceof work. What you’re currently doing is merely copying properties into one object, and use that as prototype of the returned function. As a result, the information that Parent is a parent of Man is lost.

You’d need to set the prototype instead of copying. Since you need to modify an existing object to set the underlying prototype of, the deprecated __proto__ property is required. Object.create cannot be used here, because that returns a new object.

Edit: It is possible without __proto__, but you’d need the function F trick: http://jsfiddle.net/p9pvQ/.

var clazz = null,
    pros = Object.prototype; // root of chain

for (var i = 0; i < arguments.length; i++) {
    var arg = arguments[i];

    if (typeof arg === "function") {
        arg = arg.prototype;
    } else {
        if(arg.init) {
            clazz = arg.init;
            delete arg.init;
        }
        var o = arg;
        arg = (function() { function F() {}; F.prototype = pros; return new F; })();
        for(var key in o) arg[key] = o[key];
    }

    pros = arg;
}

m will then have the prototype chain as follows:

Class.init // m
  gender: "man"
  name: "kk"
  __proto__: F // Man
    __proto__: F // Person
      say: function (){
      __proto__: Object // Object.prototype
        __defineGetter__: function __defineGetter__() { [native code] }
        __defineSetter__: function __defineSetter__() { [native code] }
        ... (Object.prototype functions)