3

I'm designing an OOP inheritance pattern for many applications I'm building. Javascript has many ways of doing this, but I stumbled on a pattern I really like. But now I'm struggling with the need for a separation of classes and instances.

I have a base object called Root. And it has a main method called inherit. To create a new object you use

var Person = Root.inherit({
    name : "",
    height : 0,
    walk : function() {},
    talk : function() {}
});

Then to create an "instance" you would

var sally = Person.inherit({
    name : "sally",
    height : "5'6"
});

sally can .talk() and she can walk() and she has a .name and a .height You can make more people the same way.

If you want a constructor you use

var Person = Root.inherit({
    _construct : function() {
        // do things when this object is inherited from
    },
    name : "",
    height : 0,
    walk : function() {},
    talk : function() {}
});

It also has the ability to have init, when the object is first defined in code (singletons use this)

var Person = Root.inherit({
    _init : function() {
        // called at runtime, NOT called if an object is inherited from me
    },
    name : "",
    height : 0,
    walk : function() {},
    talk : function() {}
});

So as you can see, everything uses .inhert(). There are no classes and no instances really. Everything is an instance of something. The only real problem I found so far is that there is no concept of "type", but you can always just check for a method if you need to. Also you can't protect a 'class', as a 'class' can be changed during execution if the developer accidentally changed it, or meant to change it.

So my question is: Is there a need in javascript to have an explicitly and controlled separation of class structure and instances of the class? Are there any issues with treating every object as an instance?

Improve this question
2
  • this method is similar to the one I found in Crockford's book. Commented May 15, 2012 at 5:05
  • You're right, it's not pure JSON. I took that out. I was meaning more the JSON style, but really that is just Objects. Commented May 15, 2012 at 5:09

6 Answers 6

Reset to default
4

No there's no need since Javascript is a Prototypal based language, meaning that classes are not involved. You are just creating clones of the objects.

http://en.wikipedia.org/wiki/Prototype-based_programming

As far as the concept of type, the type is object.

A good read for more info about this would be Javascript Patterns by Stoyan Stefanov he has several different creational patterns that address your concerns, including examples that implement Design Patterns from the gang of four's design patterns. http://www.amazon.com/JavaScript-Patterns-Stoyan-Stefanov/dp/0596806752

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

The key is to think less hierarchically and more linearly. Any object can inherit (be cloned from, with a proto link) from any other object, and then modified to make it unique. Where the instance's properties and behaviors aren't modified, they inherit from the prototype's properties and behaviors. There are no classes in the traditional sense - everything is a "class."
2

So my question is: Is there a need in javascript to have an explicitly and controlled separation of class structure and instances of the class? Are there any issues with treating every object as an instance?

Not really, if you're happy with it, it's fine.

The more normal form of JavaScript inheritance does much the same thing. You'll frequently see structures like this (severely cut down for brevity):

function Base() {
}
Base.prototype.foo = function() {
};

function Derived() {
}
Derived.prototype = new Base();

...and of course, new Base() is also how you create instances of Base. So your system is quite similar.

Again, the above is a sketch, not a full example. For one thing, usually you'd see construction and initialization separated out, so you don't literally see Derived.prototype = new Base() so much as something that creates an object with Base's prototype but without actually calling Base (which Derived would do later), but you get the idea. Granted that statement somewhat weakens the similarity with your system, but I don't think it breaks it at all.

At the end of the day, it's all about objects (instances), which are either used directly (your sally) or indirectly by providing features to other objects (Person, Root) by cloning or by setting them up as the prototype of the other object.

Improve this answer

5 Comments

And this syntax I think is why ECMAScript 5 has Object.create() to extend a copy with methods. IMO I think the above syntax can be be a bit messy, and doesn't give you the extendability with objects that you often have to do.
@SeanClark: Yes, I wasn't saying it was pretty (and it's not what I use), I was just using "the bog standard" version to compare with what you're doing and point out that conceptually they're similar. And indeed, in a less naive version of the above, you'd see Derived.prototype = Object.create(Base.prototype); or Derived.prototype = Object.create(Base.prototype, {/* stuff for Derived here*/}); (where presumably the author would have polyfilled Object.create on a non-ES5 environment).
lineage is interesting. It looks like in order to set a bunch of properties on your new objects() you have to do it in separate lines? Did you happen to do any deep copy extend for passing in properties?
@SeanClark: Thanks. You'd usually add properties in the initialize function (hard-baked ones, and ones from arguments). What form those arguments are (e.g., a spec object or discrete args or whatever) is left to the author. (I keep thinking of a Lineage.extend utility function, but have to remind myself that anyone who wants it probably already has it in some form, so it would be cruft.)
@SeanClark: Separately: If you're looking at the source, note that Lineage doesn't use any ES5 stuff because it didn't really need it, and I wanted to avoid dependencies on shims. Increasingly I'm wanting, in general, to use ES5 stuff so I may adopt an "assume a shim" attitude at some point, but haven't yet. ;-) If you want to discuss any of this further, feel free to drop me an email, although FWIW I'm not really around the next couple of days. Best,
1

Javascript's inheritance is prototypical which means everything object is an instance. You actually have to do extra work to get the classical inheritance.

Improve this answer

1 Comment

There were a couple questions, I was answering "Are there any issues with treating every object as an instance?"
1

This is how I work in javascript 

// this is class
function person(){

    // data is member variable 
     this.name = null;
     this.id = null;

    //member functions 
     this.set_name = _set_name;
     this.get_name = _get_name;
     this.set_id = _set_id;
     this.get_id = _get_id;

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

 function _get_name(name){
    return this.name;
 }

     function _set_id(id){
    this.id = id;
 } 

 function _get_id(id){
    return this.id;
 }
}

// this is instance
var yogs = new person();

    yogs.set_id(13);
    yogs.set_name("yogs");

hope it may help

Improve this answer

3 Comments

but you're overwriting the entire data property. What if you only want to define name and id for yogs, but still have a bunch of class properties as part of this.data?
Ya, this was my go to pattern in the past. I just got tired of having to write "this" so many times. And then once applications become more complex, writing yogs. yogs. over and over again, becomes overworked. So then you end up creating an extend function, and passing an object, then you gotta parse that to make sure it does what you want. I guess the goal was to write a better syntax. shrugs
There's no point in having set_name and get_name functions when you have a public name property on the instance code can just assign to and use directly, bypassing them entirely (and similarly for get_id / set_id). Did you mean for name and id to be vars in the constructor rather than properties?
0

Start with some basic object...

// javascript prototypes - callback example - javascript objects

function myDummyObject () {
    that = this;
} // end function myDummyObject ()

// begin dummy object's prototype
myDummyObject.prototype = {
    that : this,

    // add a simple command to our dummy object and load it with a callback entry
    say : function () {
        var that = this;

        console.log('speaking:');
        that.cb.run("doSay");
    }
} // end myDummyObject proto

extend with a sub prototype.. 

// here we addon the callback handler... universally self sufficient object
var cb = {
    that : this, // come to papa ( a link to parent object [ myDummyObject ] )

    jCallback : new Array(new Array()),     // initialize a javascript 2d array 
    jCallbackID : -1,                       // stores the last callback id

    add: function(targetFnc, newFunc) {
        var that = this;
        var whichID = that.jCallbackID++;

        // target, addon, active
        that.jCallback[that.jCallback.length] =  { 'targetFunc' : targetFnc,  'newFunc' : newFunc,  'active' : true, 'id': whichID };

        return whichID; // if we want to delete this later...      
    }, // end add

    run: function(targetFnc) {
        var that = this;

        for(i=0;i <= that.jCallback.length - 1;i++) // go through callback list
            if( that.jCallback[i]['targetFunc'] == targetFnc  && that.jCallback[i]['active'] == true )
                that.jCallback[i]['newFunc'](); // run callback.
    }, // end run

    remove: function (whichID) {
        var that = this;
        console.log('removing:' + whichID); 

        for(i=0;i <= that.jCallback.length - 1;i++) // go through callback list
            if( that.jCallback[i]['id'] == whichID  )
                that.jCallback[i]['newFunc'](); // run callback.
    } // end remove
}                                                               

// add the object to the dummy object...
myDummyObject.prototype.cb = cb;

Example:

var testing = new myDummyObject();

testing.cb.add('doSay', function () { console.log('test: 213123123'); } );

// test remove...
var testid = testing.cb.add('doSay', function () { console.log('test: 12sad31'); } );
testing.cb.remove(testid);

testing.cb.add('doSay', function () { console.log('test: asdascccc'); } );
testing.cb.add('doSay', function () { console.log('test: qweqwe'); } );
testing.cb.add('doSay', function () { console.log('test: d121d21'); } );
testing.cb.add('doSay', function () { console.log('test: wwww'); } );


testing.say();
Improve this answer

Comments

0

This always seemed the easiest for me to understand... Just create a new instance of the inherited class and then loop through its variables and methods and add them to the main one. 

var myPerson = new Person()

var myPerson.firstName = 'john';
var myPerson.lastName = 'smith';
var myPerson.jobTitle = 'Programmer';    

var Person = function(){

    //Use this to inherit classes 
    this._extendedClass = new Person_Job();
    for(var i in this._extendedClass){
        this[i] = this._extendedClass[i];
    }
    delete this._extendedClass;

    this.firstName = '';
    this.lastName = '';
}

var Person_Job = function() {

    this.jobTitle = '';

}
Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.