What is the purpose of "x = x || 0"? [duplicate]

Question

In looking through some code I found online, I found this peculiar line of code (Javascript):

function values(b) {
    this.b = b || 0;
}

I simply can't figure out what the purpose of the ||0. If I'm not mistaken, since || returns a boolean, this value, b will always be whatever the boolean equivalent of the parameter is. If b is passed as true (ie 1 or true), then b should be true; otherwise, using one of the false values (ie. NaN, 0), this should be false. I then interpret this as the following:

b is true:

this.b = true || false; // will evaluate to true

b is false:

this.b = false || false; // will evaluate to false

I just don't see the value gained by adding ||0. Could someone please explain this to me?

Answer 1

|| in a variable assignment is a common way to specify a default value. This is because of JavaScript's falsy values. In JavaScript, undefined, null, empty string and 0 all evaluate to false in a boolean context.

For example:

var blah = undefined;
if (blah) {
    console.log('got it!');
}
else {
    console.log('not true!');  // this one outputs
}

Using || in an assignment is a way of saying "if defined, otherwise use this".

For this code,

function values(b) {
    this.b = b || 0;
}

we can use a truth table:

b          this.b
------------------
5          5
10         10
0          0
undefined  0
null       0
''         0

The values really of interest are undefined and null. So what we really want is:

if (b !== undefined && b !== null) {
    this.b = b;
}
else {
    this.b = 0;
}

But this.b = b || 0 is much shorter to write.

Answer 2

|| returns a boolean only when both of its operands are booleans. Otherwise, it returns (from left to right) the first operand that isn't "falsy" or the last one if it can't find any.

In that function, this.b is meant to be a number but the b argument to the function is optional (so it could be undefined). To make this.b always a number, they used that. So if you didn't pass b, it'd look like:

this.b = undefined || 0

And this.b will be set to zero because undefined is always "falsy".

A resource on truthy vs falsy: http://www.sitepoint.com/javascript-truthy-falsy/

The logic behind logical operators: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_Operators

Answer 3

This is a pretty classic question that gets tossed around relatively frequently.

The main purpose of utilizing something like x = x || 0 is to ensure that x will have a false value Boolean, as you've described, but rather than having null or false, you are returning 0.

The reasoning behind using the above rather than say, x = x || false is that you will end up returning 0 (much easier to manipulate integer or float based data) rather than the other values.

Everything you've suggested is relatively true. For example:

var x = x || false; // False
var y = x || 0;     // 0
var z = x || null;  // Null
alert(x);
alert(y);
alert(z);

If you had a purpose to use a true or false value, your suggestion would be perfectly adequate.