Last Updated: February 25, 2016
·
1.605K
· darkmantiscs

Object Orientated Javascript

One thing I have noticed with a lot of Javascript developers is that they do not chose to create their scripts using Objects containing their methods, properties and values.

There is obviously uses for doing it this way (and uses for not).

Pros:
Clean code, Easy to read, Keeps everything organized

Cons:
Slightly more complex method than Procedural

Here is a sample of very simple example (untested and unchecked) of OO JS

var Channel = {
  list      : new Array(),
  previous  : 0,
  current   : 1,
  next      : 2,

  getNext: function(){
    return this.next;
  },
  getPrevious: function(){
    return this.previous;
  },
  getCurrent: function(){
    return this.current;
  },
};

 // Calling the methods
Channel.getNext();
Channel.getPrevious();
Channel.getCurrent();

Now obviously, this is very simple and a quick example (untested and unchecked).

In my opinion this is a much better method to adopt over the normal procedural functionality of writing Javascript. This is solely based on opinions and previous experiences.

Now this is a great method for writing Javascript if you are going to use a JS Library such as Prototype-JS (as most RoR developers will probably know) because Prototype adopts this method of writing code a lot.

I'm sure I will be corrected on this tip, but like I said, solely based on opinions here.

4 Responses
Add your response

To me that is only object oriented in the sense that you are using an object to organise your code.

A true OO JS approach would be to write interacting classes with distinct roles which contain methods and properties - https://developer.mozilla.org/en-US/docs/JavaScript/Introduction_to_Object-Oriented_JavaScript.

I like to use a true OO approach in combination with the modular design pattern which is similar to your code above but declares the object inside a self invoking function housing private methods and properties and returning only the public data. - http://javascriptplayground.com/blog/2012/04/javascript-module-pattern

over 1 year ago ·

I apologize, my Javascript really isn't up to scratch by anybodies standards, and I totally forgot you could manage "Classes" like that.

So yes, I agree with you totally there. I should have done more research into this before "jumping the gun".

Kudos.

over 1 year ago ·

No worries. You should certainly check out the modular design pattern though. It's very similar to the code you already write but extra cool because you can store private properties and methods and return just the stuff you need to be public, keeping your code more secure.

over 1 year ago ·

Choosing patterns to use in Javascript seems heavily dependent on your use case. Do you need a fancy, highly interactive frontend? Then you can be using "OO Javascript" in no time with Backbone.JS.

On the other hand, if you do not need the powers of a client-side MVC but still need code organization, I recommend trying to abstract some of the JS into jQuery plugins. And, on top of that, you can write your plugins in an OO fashion. Check out the Bootstrap jQuery plugins (https://github.com/twitter/bootstrap) for excellent examples of well-written plugins.

over 1 year ago ·