Object oriented javascript with prototypes vs closures

by

The second one doesn’t really create an instance, it simply returns an object. That means you can’t take advantage of operators like instanceof. Eg. with the first case you can do if (myBook instanceof Book) to check if the variable is a type of Book, while with the second example this would fail.

If you want to specify your object methods in the constructor, this is the proper way to do it:

function Book(title) {
    this.title = title;

    this.getTitle = function () {
        return this.title;
    };
}

var myBook = new Book('War and Peace');
alert(myBook.getTitle())

While in this example the both behave the exact same way, there are differences. With closure-based implementation you can have private variables and methods (just don’t expose them in the this object). So you can do something such as:

function Book(title) {
    var title_;

    this.getTitle = function() {
        return title_;
    };

    this.setTitle = function(title) {
        title_ = title;
    };

    // should use the setter in case it does something else than just assign
    this.setTitle(title);
}

Code outside of the Book function can not access the member variable directly, they have to use the accessors.

Other big difference is performance; Prototype based classing is usually much faster, due to some overhead included in using closures. You can read about the performance differences in this article: http://blogs.msdn.com/b/kristoffer/archive/2007/02/13/javascript-prototype-versus-closure-execution-speed.aspx

More Related Contents:

  1. Null error is coming in javascript
  2. How do I remove a property from a JavaScript object?
  3. Use of .apply() with ‘new’ operator. Is this possible?
  4. Why is it necessary to set the prototype constructor?
  5. Organize prototype javascript while perserving object reference and inheritance
  6. Constructor function vs Factory functions
  7. Defining a Javascript prototype
  8. How is almost everything in Javascript an object?
  9. Preserving a reference to “this” in JavaScript prototype functions [duplicate]
  10. Is it possible to get the non-enumerable inherited property names of an object?
  11. How does the new operator work in JavaScript?
  12. How do I make JavaScript Object using a variable String to define the class name?
  13. What is “undefined x 1” in JavaScript?
  14. Declaring javascript object method in constructor function vs. in prototype [duplicate]
  15. What techniques can be used to define a class in JavaScript, and what are their trade-offs?
  16. prototype based vs. class based inheritance
  17. Does JavaScript have the interface type (such as Java’s ‘interface’)?
  18. Clone Object without reference javascript [duplicate]
  19. How to inherit from a class in javascript?
  20. Sorting objects by property values
  21. No ways to have class-based objects in javascript?
  22. Why should you not use Number as a constructor? [duplicate]
  23. How adding event handler inside a class with a class-method as the callback?
  24. JavaScript Extending Class
  25. In Javascript, what does this underscore mean?
  26. Classical Vs prototypal inheritance
  27. Is John Resig’s Javascript inheritance snippet deprecated?
  28. How do I create an abstract base class in JavaScript?
  29. Split a Javascript class (ES6) over multiple files?
  30. What does the new keyword do under the hood?

Leave a Comment