3

What is the purpose and result of the following line?

var arr = arr || [];
Andrei Oniga
  • 8,219
  • 15
  • 52
  • 89
  • Note that var arr = foo || []; may result in an error if foo is undefined. The two statements are otherwise identical. – AlexMA Sep 13 '12 at 16:57
  • What do you mean by "It may..."? Meaning in what circumstances does it throw an error? – Andrei Oniga Sep 13 '12 at 17:02
  • It will *always* throw an error if foo is undefined. I reworded the sentence and failed to change that word. – AlexMA Sep 13 '12 at 18:11

3 Answers3

7

It declares the variable "arr" and sets its value to be that of another variable already in existance (presumably in some outer scope), unless that variable is not "truthy" in which case "arr" is set to reference a new empty array.

Thus if the already-existing "arr" has the value null, 0, false, or "", or is undefined, then the local "arr" will be an empty array. Otherwise, it will have the same value as the outer "arr".

You'd usually see that in a situation like this:

var arr;

function whatever() {
  var arr = arr || [];
  ...
}

Sometimes people do this:

function questionable( arr ) {
  var arr = arr || [];

In that case, the var is unnecessary.

This all works because the || operator in JavaScript is distinctly different than it's cousins in other C-like languages. In JavaScript, the value of a || expression is not forced to be a boolean. Instead, it's the value of either its left-hand operand or its right-hand operand. It does inspect the values to determine whether they're "truthy", but that boolean coersion is internal. If the left-hand side is "truthy", then the value of the || expression is that value; otherwise, it's the value of the right-hand side. When the left-hand side is "truthy" the right-hand side is not evaluated at all.

Pointy
  • 405,095
  • 59
  • 585
  • 614
3

Instantiates a new instance of Array if arr is falsy.

In C#, this pattern is referred to as a "null coalescing operation." If you're familiar with C# you'd do something like the following:

string foo = bar ?? String.Empty

Here's a thorough post on the topic.

Community
  • 1
  • 1
Alex
  • 34,899
  • 5
  • 77
  • 90
2

Basically in Javascript, and other languages (like Perl for instance), the || is often used as a short-circuit operator. If you have a variable that needs to be assigned the value of one of the 5 other variables, whichever is first defined, you can try something like:

a = b || c || d || e || f;

This will evaluate b. If its value is true, then a will be assigned b, and that's it. If b is found to be false, then the search will propagate to c. Often a variable needs to be compared to itself to check whether to assign a new value. This is what the a = a || b does. Were it Perl, you could have shortened it to a ||= b.

SexyBeast
  • 7,913
  • 28
  • 108
  • 196
  • Syntax such as "a ||= b" is also present in C, although it's actually "a |= b". Nevertheless, thanks for the info, it's very helpful. – Andrei Oniga Sep 13 '12 at 17:06