In Ruby, we create an object using the class-statement. An example of creating a Person object in Ruby is shown below. (Remember that this is only creating the "blue-print" for an object, which is separate from creating an instance of an object.)
In JavaScript, there is no class-statement. But there are not
one but two ways to create a JavaScript object: Literal notation (below
left) and Constructor function (below right). For the Constructor method,
you have the option of two syntax styles. Below is the equivalent JavaScript
(not quite for the Literal notation-- more later) to the Ruby object created above:
JavaScript syntax looks strange having come from Ruby, right? The Literal notation looks not unlike a Ruby Hash. The Constructor function syntax is equally wierd: it looks like a function being assigned to a variable, not creating an object. Perhaps a helpful way to think about the Constructor function syntax is this: those aren't any ol' functions being assigned to a variable name. Those are constructors! The JavaScript equivalent of def initialize from Ruby. And we all know constructors mean constructing an object.
Now let's instantiate our Person object in Ruby. And with that instance, call its method to say hello. The code would look like this:
RUBY OBJECT INSTANTIATION AND METHOD CALL
And now to instantiate our Person object in JavaScript for both Literal notation and Constructor function, and call the instance method to say hello:
Wait. Why does creating a Literal object instance look just like the code
to create the "blue-print" for a Literal object?? Aha! That's because for
JavaScript Object Literals, creating an object (its "blue-print") and its
instance are done together and simultaneously! There is no separation.
(That's the reason why in the above LITERAL
NOTATION example, the firstName property suspiciously didn't get any
value.) There's a catch: an Object Literal has one and only one instance ever.
By contrast, a Constructor function object can instantiate an unlimited number of instances. That is the key difference between the two ways to create an object in JavaScript. (Technically, there's a third way using Object.create(), but we won't go there.)
You might wonder: If there are two ways in JavaScript to create an object, how do I know which one to use? The Literal notation or the Constructor function? This article suggests the following guidelines:
Literal is a preferred option for name spacing so that your JavaScript code doesn't interfere (or vice versa) with other scripts running on the page and also if you are using this object as a single object and not requiring more than one instance of the object, whereas Constructor function type notation is preferred if you need to do some initial work before the object is created or require multiple instances of the object where each instance can be changed during the lifetime of the script.
References: