Understanding the JavaScript comma operator

Question

This article by Angus Croll explains the JavaScript comma operator like this:

//(LHE: left hand expression, RHE right hand expression)

LHE && RHE
1. Always evaluate LHE
2. If LHE is true, evaluate RHE

LHE || RHE
1. Always evaluate LHE
2. If LHE is false, evaluate RHE

LHE, RHE
1. Always evaluate LHE
2. Always evaluate RHE

However, I have made a jsfiddle test enter link description here with the code below, and it appears that the LHE must be surrounded by parentheses if the operator is &&.

// Works fine
(function one(window) {
    window.testOne = function testOne() {
        alert("Test one");
    }, testOne();
})(window);


// Works, but JSHint complains at *:
// "Expected an assignment or function call but saw instead an expression"
(function two(window) { 
    (window.testTwo = function testTwo() {
        alert("Test two");
    }) && testTwo(); // *
})(window);


// Looks good to JSHint, but fails at runtime:
// "ReferenceError: Can't find variable: testThree"
(function three(window) {
    window.testThree = function testThree() {
        alert("Test three");
    } && testThree();
})(window);

Can you explain why testOne (using ,) does not require parentheses around the first expression, but testTwo (using &&) does? And why does JSHint consider test() not to be a function call?

Answer 1

It's a case of operator precedence. The operators you use have the following precedence: &&, ||, =, ,.

This means var ... = ... && ... is equivalent to var ... = (... && ...) but var ... = ... , .... is equivalent to (var ... = ...) , .....

You can check the precedence here, for example.

Answer 2

This code first assigns and then calls

(window.testTwo = function testTwo() {
    alert("Test two");
}) && testTwo();

1. Assign window.testTwo = function testTwo() { alert("Test two") };
2. Call testTwo()

But this other one attempts to call before the assignment

window.testThree = function testThree() {
    alert("Test three");
} && testThree();

1. Evaluate the function expression (not declaration, so no testThree variable is created!) function testThree() { alert("Test three") }
2. Call and assign window.testThree = testThree();

However, testThree is undeclared. So an error is thrown.