JavaScript or (||) Variable Assignment Explanation

JavaScript OR (||) variable assignment explanation

See short-circuit evaluation for the explanation. It's a common way of implementing these operators; it is not unique to JavaScript.

Why is this method of variable assignment causing issues?

The difference is that with the second one, you're trying to assign to a properties variable that you haven't declared. The var only applies to prop, not properties because properties is on the right-hand side of the = after prop, so it's part of the initializer for prop. Here's how it's grouped:

var prop = (properties = this.properties);
//         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^−−−− initializer for `prop`

In loose mode, that means you're falling prey to what I call The Horror of Implicit Globals — it creates a global called properties. In strict mode, assigning to an undeclared identifier is the error it always should have been. (All new code should be written using strict mode.)

You can declare multiple variables with var, etc., but you can't assign to them all using the same value source (without repeating it).

You could do:

var prop, properties;
prop = properties = this.properties;

if you liked. Or alternatively:

var prop = this.properties, properties = prop;

That works because the initializers in a var (or let or const) with multiple declarations are executed in source code order, left-to-right, so prop = this.properties happens before properties = prop does.

---

Side note: var shouldn't be used in new code, use let or const. (If you have to support obsolete JavaScript engines, you can transpile modern code to ES5.)

How OR logical assignment works in Javascript

What you get is NaN, because of adding to undefined a value.

console.log(undefined + 1);

What does variable || {} in javascript?

This code assigns {} to vendorcode if vendorcode is false-y.
Meaning it's undefined, false, 0, null, etc.

If vendorcode is not false-y it'll keep its value.

You can read it out loud as: "vendorcode equals vendorcode OR {}"

Javascript OR operator in variable assignment with jQuery selectors

As jQuery method returns a jQuery object which will always be truthy; thus you are getting undefined. if you are only intending to get HTML you can use.

var active = container.children('li.active').html() || container.children('li:first-child').html();

However you want to get the element, do away with || and use .length property to check if element exists.

var active = container.children('li.active');
if(active.length == 0)
    active = container.children('li:first-child')

var container = $('.dummy');

var active = container.children('li.active').html() || container.children('li:first-child').html()

console.log(active);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<ul class="dummy">

  <li>One</li>

  <li>Two</li>

  <li>Three</li>

</ul>

How does javascript logical assignment work?

For your q || a to evaluate to a, q should be a 'falsy' value. What you did is called "Short circuit evaluation".

Answering your questions:

1. The logical operators (like and - &&, or - ||) can be used in other situations too. More generally in conditional statements like if. More here

2. Empty string is not treated as undefined. Both are falsy values. There are a few more falsy values. More here

3. AND, or && in JavaScript, is not a variable. It is an operator

4. The idiom you have used is quite common.

   var x = val || 'default'; //is generally a replacement for

   var x = val ? val : 'default' //or

   if (val)
var x = val;
else
var x = 'default';

Variable equals to A || B. How does this work?

It sets a default value for out, ie if out is not provided to the function, (or it is a falsy value such as false, 0, null, undefined or ''), then out is assigned {}.

How it works:
Javascript uses short circuit evaluation, which means the the or (||) operator will return the first non-falsy value. If out is not falsy, nothing changes, if out is falsy, it gets set to {}.

Does a JS equivalent of Python's Multiple Variable Assignment exist?

In the question, you state that you cannot use Destructuring. However, Destructuring, more precisely an Array Destructuring Binding Pattern is exactly the right tool to use here, so you really should be using it. (Well, except for the fact that it is redundant, but more on that later.)

Here is how you would do a 1:1 translation of the Python code (Well, except for the fact that ECMAScript does not have Tuples) to ECMAScript:

function numbers(arr) {
    if (arr.length <= 1) {
        return arr;
    }

    const [leftHalf, rightHalf] = divide(arr);
    return [leftHalf, rightHalf];
}

function divide(arr) {
    const mid = Math.floor(arr.length / 2);
    const left = arr.slice(0, mid);
    const right = arr.slice(mid);

    return [left, right];
}

The only difference of the ECMAScript code compared to the Python code is that in the Python code, both numbers and divide return a Tuple whereas ECMAScript does not have Tuples, so, in the ECMAScript code, they return Arrays.

However, note that in both the Python and the ECMAScript version, numbers destructures the return value of divide, only to put it back together with the exact same data structure, so you can just get rid of most of that code:

function numbers(arr) {
    if (arr.length <= 1) {
        return arr;
    }

    return divide(arr);
}

def numbers(arr):
  if len(arr) <= 1:
    return arr

  return divide(arr)

You will also notice that I changed all your variables to consts in the ECMAScript code, since you are not modifying their bindings.

This API is weird and hard to use, though, because the numbers function returns two completely different things depending on the length of the argument array. It returns either an array of numbers or an array-of-arrays-of-numbers (in ECMAScript, in Python, it returns a tuple-of-arrays-of-numbers). This makes it harder for the caller to use since the different return types need to be treated differently.

---

Related Topics