Javascript: Constructor or Literal notation?

Question

This question is more aimed at the developers who do this professionally, and or work as freelancers/in teams/for businesses/etc.

Is using literal javascript notation more sought after than constructor notation? Does it really matter what kind of notation you use when writing Javascript? Do employers care, or is there a more professional notation?

LITERAL NOTATION

var snoopy = {
    species: "beagle",
    age: 10
};

CONSTRUCTOR NOTATION

var buddy = new Object();
buddy.species = "golden retriever";
buddy.age = 5;

If there is no reason to use a constructor (for example, if you want a plain object) then there is a VERY STRONG preference in the community to use literal notation. Even `new Array()` is frowned upon and `[]` is preferred. Personally, if I see an api requiring the `new` keyword I'd expect there to be a good reason for needing it. — slebetman, Aug 29 '16 at 04:52
http://stackoverflow.com/questions/4597926/what-is-the-difference-between-new-object-and-object-literal-notation — Ram, Aug 29 '16 at 04:54
I can't think of a good reason to use `new Object()`. I can't even think of a mediocre reason to use `new Object()`. — nnnnnn, Aug 29 '16 at 05:56

jfriend00 · Answer 1 · 2016-08-29T05:14:47.137

If the literal notation will work for your situation, then it is more usually compact and is generally preferred over your second method. There are some types of properties that cannot be expressed in the literal notation so they must be set by manually assigning a property as in your second scheme.

For example if you want to refer to some other property on the object, you can't do that in a literal definition so you have to do that with a property assignment on an already constructed object.

var snoopy = {
    species: "beagle",
    age: 10
};

snoopy.peopleAge = convertDogAgeToPeopleAge(snoopy.age);

What you refer to as the "constructor notation" is not really what most people would say is how you use a constructor to initialize an object. Usually, a constructor is used when you want to be able to make more than one of a given type of object such as:

function Animal(species, age) {
    this.species = species;
    this.age = age;
}

var buddy = new Animal("golden retriever", 5);
console.log(buddy.species);    // "golden retriever"

var snoopy = new Animal("beagle", 10);
console.log(snoopy.species);    // "beagle"

What you have called a constructor is just another way to create a new empty object. Both of these do the same thing:

var x = {};
var y = new Object();

Again, the first way is generally preferred because it's more compact and potentially easier for the interpreter to optimize and the Javascript community seems to just have decided that a literal declaration of {} or [] is preferred unless there is an explicit reason to have to use the new xxxx() form.

philipp · Answer 2 · 2016-08-29T05:01:19.307

the notation new Object() and {} are technically the same, so there is no difference. If you write:

let obj = {
    prop: 'val',
    .
    .
}

It looks nicer in my opinion and saves some keystrokes, because you do not have to type: obj. each time.

The same holds true for Arrays. Using new Array() or just [] is nearly the same, except, that new Array(<length>) takes the optional length parameter, which is used to initialize the length of the array. Anyway, even if an Array constructed like that has a length bigger than zero, its values are just undefined, and functions like map(), reduce(), forEach ignore those values, so you need to "fill" the Array differently, what makes this way of construction some kind of useless.

Another thing are objects using a "real" constructor in Javascript like:

function MyType () {
    this.prop = '';
}

which are instanciated like:

var type = new MyType();

because those can be compared by type like type instanceof MyType, to distinguish instances by their type.

score 0 · Answer 3 · answered Aug 29 '16 at 05:18

Both notations are equivalent, but the literal notation is preferable for a few reasons:

Object literals are short and highly visual. Repeating the instance variable over and over to set a few properties not only takes more time to type but makes it harder to read through the code quickly. But that's pretty obvious.
Some JS engines are made to optimize memory access and usage for objects with a constant set of properties. Creating a blank object before setting its properties could either prevent the engine from doing such optimizations or simply slow down the process.
Object literals are very close to, or technically a superset of JSON notation. Even people who don't write JS might use the JSON format from time to time, so it has become a very popular syntax everyone understands.
Most JS minifiers will replace var foo = new Object(); with var f=new Object; instead of the much shorter var f={};
Google says to use the literals. I might be biased, but listening to them sounds like a good plan.
As depicted in Google's style guide, property access doesn't work with the dot operator if the property name has special characters, so property access looks less consistent. Meanwhile, special property names only have to be quoted to work in literals.

Javascript: Constructor or Literal notation?

3 Answers3