Classes for JavaScript

Classic OOP relies on classes that are essentially object blueprints. You define a class by naming it and adding attributes and methods. Objects are created by new operator that allocates memory and initializes it accordingly to the class design. The ultimate purpose of this setup is to create objects that can do appropriate things.

Each object encapsulates data in its attributes, typically hiding them from other objects. Methods defined in class are bound to objects and are used to give access to object data, for reading or writing. This turns object into an abstraction with a particular interface; you think of objects as of entities that can do certain things and don't care how they do it. This is the reason why OOP is so popular: it is a natural implementation of the 'divide and conquer' principle; instead of shuffling primitive numbers and strings you wire more complex entities to communicate and solve your computing problems.

In JavaScript we have objects but no classes. Actually there are some classes, but they are fixed and you can't define your own class. Every custom object you create is a simple dictionary: a bag of name-value pairs that may store numbers, strings, functions and other objects.

Objects are created by the new operator and initially have no properties or methods (except 'system' stuff like the toString() function). You are supposed to initialize objects later, possibly by providing a dedicated function to do it. And you may write this function in a way that will complement the new operator and make objects look as if they were created from the same blueprint. This means that in JavaScript we may substitute class by a constructor function.

Since every function invocation in JavaScript creates a closure we may use it to store object's hidden attributes. This means that objects in JavaScript are split in two parts: the object itself that exposes the behavior and closure with private stuff.

Below is a Java class and JavaScript function that achieve the same effect:

class Order {
  public String article;
  private double price;
  private int quantity = 1;

  public Order(String article, double price) {
    this.article = article;
    this.price = price;
  }

  public double total() {
    return quantity * price;
  }

  private int validQuantity(int value) {
    return value < 1 ? 1 : value;
   }

  public void setQuantity(int value) {
    quantity = validQuantity(value);
  }
}

function Order(article, price) {
  this.article = article;
  var quantity = 1;

  this.total = function() {
    return quantity * price;
  };

  function validQuantity(value) {
    return value < 1 ? 1 : value;
  }

  this.setQuantity = function(value) {
    quantity = validQuantity(value);
  };
}

Here are the rules to convert Java classes to JavaScript constructor functions:

  1. Identify class constructor and translate it to JavaScript.
  2. Constructor parameters automatically become private attributes.
  3. Declare and initialize local variable for each missing private attribute.
  4. You don't have to declare public attributes, they will be represented by object properties. However, you should initialize them.
  5. Translate public methods to JavaScript functions and bind them to object properties.
  6. Translate private methods to JavaScript functions.
  7. All protected attributes and methods become public.
  • Digg
  • del.icio.us
  • Reddit
  • StumbleUpon
  • LinkedIn
  • E-mail this story to a friend!
  • Print this article!

blog comments powered by Disqus