Acceptable/good way of doing Javascript "classes" (OOP)?

Question

I've been wondering for a long time how to do Javascript correctly, and I've read about it but never really tried anything myself. I chose to use the Object.create method. The con with Object.create is that there is no constructor function, which is something I kinda like. So I came up with my "own" way of including it.

My question is simply - is this a good way of doing Javascript OOP?

http://pastebin.com/AkG0KpAR

edit: updated Object.init

edit2: removed inline code and added pastebin link

Answer 1

I'll start by answering your question with how I would achieve your goal, but then provide you with how I would achieve it in a different way.

Your way is certainly one way of doing it, but I tend to flinch when people use JS OOP style since it's a prototypal language. It's far too big to discuss here, but you should read up on Douglas Crockford's Classical Inheritance in Javascript - he is considered one of the authorities on JS and was Yahoo's chief JS framework engineer for years if I recall correctly. This will help you understand how to approach OOP through JS.

However, JS is not really intended to be used that way. JS is a prototypal language, and you can achieve an incredible number of things using prototypes instead- and it's really not that much different.

Since you mentioned that you've been wondering how to "do javascript correctly", I'd say the following: If I were to achieve what you want, which is to add an init method to all objects, I'd target the object's prototype:

Object.prototype.init = function(){...}

A really solid approach to modular Javascripting is to make a function type that has a defined prototype like so:

var CalendarObject = function(){}  //<-- Essentially a class definition

CalendarObject.prototype = {
    init:function(){
        //Do init stuff
    },

    launchYear2k:function(){
        //Destroy the world
    }
}

To use this, all you have to do is make a "new" calendar object:

var c = new CalendarObject();

You can code this out just like most OOP style constructors. Anything you put in the CalendarObject definition function will be executed when you call new CalendarDefinition(). That means that you can auto-call the init function if you want, you can initialize variables, etc.

A serious boon to this is that protypes are JSON objects. That's it. If you know JSON you can understand how super powerful this can be. Read up on Crockford's site and you can start to see how to make getters and setters if you want that type of functionality but this is really, depending on what camp youre talking to, the "correct" way to code javascript. Technically this is faster/more memory efficient than using an OOP style as well since all objects reference the global CalendarObject rather than making a new object every time as well.

That's just my two cents.

Answer 2

Look at this answer to a similar question.

Also, check out Details of the object model from MDN.

JavaScript is a prototype-based language. You don't need to come up with your own way to define a constructor, unless you want to; JavaScript already supports its own way of doing it.

//constructor
function Ninja(name) {
    this.name = name;
}

//the "class"
Ninja.prototype = {
    swung: false,
    swingSword: function() {
        this.swung = !this.swung;
    },
    get: function(prop) {
        return this.prop;
    },
    set: function(prop,val) {
        this.prop = val;
    }
}

//instantiation
var awesomeNinja = new Ninja('Jet Li');

//show a member
awesomeNinja.get('name'); //Jet Li

//some random method
awesomeNinja.swingSword();  //this.swung = true