In JavaScript, why is [ ] preferred over new Array();?

Question

I remember reading somewhere (I think it was in one of Crockford's papers) that using an array literal [] is better than using the new Array(); notation.

But I can't really remember any advantages of one over the other.

Can anyone please explain to me on why the former is preferred over the latter?

Here is one reason I can think of on why [] is better than new Array();:

var Array = function () { };

Overriding the Array object will break code...!

Any more reasons?

• nickf: of course overriding the array object will break code. If you shoot yourself in the foot, you also might not be able to walk any more.
• Andreas Grech: hehe I know I know...but what if some (dumb) library or maybe some stupid plugin overrides it heh?

Answer 1

Brevity

It has less bytes to transfer over the wire, less bytes to interpret, less mental resources to parse it.

Less is more.

Consistency

What is the difference between these two lines of code?

var arr = [5];
var arr = new Array(5);

According to here new Array(5); will not return an array with a 5 in it, instead it will return a 5 element array, with all the elements being undefined. Whereas these two lines return identical arrays.

var arr = [5,6];
var arr = new Array(5,6);

• JW.: Ugh, that constructor thing is awful. Never noticed that before.
• Aran Dekar: Avoid new Array() please refer to avoid new Array() section, which confirms barkmadley's post

Answer 2

One good reason is because the Array constructor has completely non-intuitive behavior. For example:

var a = new Array(5);
console.log(a.length); //prints "5"
console.log(a[0]); //prints "undefined"
var b = new Array(1,2);
console.log(b.length); //prints "2"
console.log(b[0]); //prints "1"

In this case, a ends up being an array of size 5 with all elements undefined, and b ends up being an array of size 2, with the values [1,2].

var c = new Array("5");
console.log(c.length); //prints "1"
console.log(c[0]); //prints "5"

And here, you end up with a single-element array, containing "5"

In general, you should probably never use the constructors on built-in types in Javascript. They all have weird edge cases like this. For example:

var s = new String("Hello");
var l = "Hello";
console.log(typeof(s)); // prints "object"
console.log(typeof(l)); // prints "string"

Answer 3

Elegance

To put it simply it just looks nicer AND is easier for a programmer to parse, especially for more complicated data structures:

var a = [
 ['a list', 'of', 'strings'],
 [1, 2, 3, 4],
 { hello: "This is an object property." }
];

Versus the clumsier OOP-oriented method:

var a = new Array();
var a2 = new Array();
a2.push('a list');
a2.push('of');
a2.push('strings');
var a3 = new Array();
a3.push(1);
a3.push(2);
a3.push(3);
a3.push(4);
var o = new Object();
o.hello = "This is an object property";
a.push(a2, a3, o);

• Zoidberg: Great answer... JSON notation is much MUCH more elegant than doing it programatically.
• Luke Schafer: Just to be pedantic - he's using object/array literals, not JSON. JSON is an extended concept designed for data interchange that has a slightly different set of rules (it's more constrained, and identifiers should be enclosed in quotes)

Answer 4

new Array(1, 2, 3) instead of [1, 2, 3] is the same as new String("cow") instead of "cow"

• back2dos: really depends on the runtime ... new String("cow") is boxed, and thus behaves like a normal object, whereas in some js implementations "cow" doesn't (you can assign dynamic properties to the 1st, but the 2nd only has the properties from it's prototype) ... same thing for Number and Boolean ...
• olliej: new String returns a new object of class String, this is a really important difference: strict equality will fail, the empty string->false conversion won't happen, you can attach properties to the object (you can't with a string). And i believe in all fast JS engines it will also end up being very slow to use.
• Aidan Gee: I don't think this is a useful comment for anyone to see. Strings are a value type and new String("cow") instead of "cow" has differences e.g. String("cow") === "cow" //false