'Javascript classes vs objects, pros and cons?

In my most recent javascript program (which is mostly for fun and proof-of-concept than anything else) I have a lot of different kinds of objects and of each kind I'd have a fair amount of "instances". So I was thinking I should use classes for these, however since they are very simple I could simply construct them directly instead of using classes...

Example of what I mean:

//I'm making a "car" object that has the properties model, miles, value and color
//using a class like:
function car (model, miles, value, color) { .... }
//so I'd create a new car by using:
mycar = new car(model, miles, value, color);

//However for an object so simple I could also do:
mycar = {model: model, miles: miles, value: value, color: color};

I'm guessing the latter method would be more efficient in some way (no call to the class's function), but is it worth it?

To decide that I'd like to know about pros and cons of using classes vs using regular objects. Like do classes take up significantly more memory for example?



Solution 1:[1]

In terms of performance, the difference comes when you add methods. If you use object literals each object needs to have a field for each method:

obj1--> { x: 10,
          f1: method1,
          f2: method2 }

obj2--> { x: 17,
          f1: method1,
          f2: method2 }

With classes, you can share common properties behind a shared prototype:

obj1--> { x:10,
          __proto__: --------> { f1: method1,
         }              /---->   f2: method2 }
                        |
obj2--> { x:17,         |
          __proto__: ---/
        }

That said, the performance differences are only going to matter if you instantiate a lot of objects and those objects have many methods and many of those methods are closures. If I were you I would give a greater emphasis to code style issues: for example, with the object literal method you can use closures to simulate private variables while if the methods are in a shared public prototype then all your instance variables need to be public.

Solution 2:[2]

First of all, there are no classes in JavaScript. So what's the difference?

  • An object instantiated by a constructor has an prototype object from which it inherits properties. This prototype object is shared by all object constructed by the same function. You can put common methods on there, which will be considerably faster.
  • The constructor function is called. You can use it to initialise your object (fill in defaults, validate parameters, etc) and you have a scope to construct closures.

Even if for some objects you don't need prototypes, a function returning plain objects for you has still advantages. At least, it provides you the flexibility to change the implementation without the need to change every instantiation in your codebase. Therefore, start with a simple

function Car (model, miles, value, color) {
    return {model: model, miles: miles, value: value, color: color};
}

(which you can even call with new without effects) and extend it later if you need to.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 hugomg
Solution 2 Community