First, let's talk about || (logical OR). Literally, it returns false only when both sides are false; otherwise, it returns true.

alert(true||false);       // true
alert(false||true);       // true
alert(true||true);        // true
alert(false||false);      // false

However, from a deeper meaning, there is a different story. Try the following code:

alert(0||1);

Obviously, we know that the preceding 0 means false, and the following 1 means true, so the result above should be true, but the actual returned result is 1. Look at the code below:

alert(2||1);

We know that the preceding 2 is true, and the following 1 is also true. So what is the returned result? The test result is 2. Continue:

alert('a'||1);

Similarly, the preceding 'a' is true, and the following 1 is also true; the test result is 'a'. Below:

alert(''||1);

From the above, we know that the preceding '' is false, and the following 1 is true, and the returned result is 1. Look below:

alert('a'||0);

The preceding 'a' is true, while the following 0 is false, so the returned result is 'a'. Continue below:

alert('a'||'b');

The preceding 'a' is true, and the following 'b' is false, so the returned result is 'a'. We continue below:

alert(''||0);

The preceding '' is false, and the following 0 is also false, so the returned result is 0.

alert(0||'');

The preceding 0 is false, and the following '' is false, so the returned result is ''.

This means:

• 1. As long as the value before || is false, regardless of whether the value after || is true or false, it returns the value after ||.
• 2. As long as the value before || is true, regardless of whether the value after || is true or false, it returns the value before ||.

Second, let's talk about && (logical AND). Literally, it returns true only when both sides are true; otherwise, it returns false.

alert(true&&false);      // false
alert(true&&true);       // true
alert(false&&false);     // false
alert(false&&true);      // false

Then, based on the above experience, let's look at cases where the values before and after && are not just boolean types.

alert(''&&1);

The result returns ''. The value before && is '' (false), and the value after is 1 (true).

alert(''&&0);

The result returns ''. The value before && is '' (false), and the value after is 0 (also false).

alert('a'&&1);

The result returns 1. The value before && is 'a' (true), and the value after is 1 (also true).

alert('a'&&0);

The result returns 0. The value before && is 'a' (true), and the value after is 0 (false).

alert('a'&&'');

The result returns ''. The value before && is 'a' (true), and the value after is '' (false).

alert(0&&'a');

The result returns 0. The value before && is 0 (false), and the value after is 'a' (true).

alert(0&&'');

The result returns 0. The value before && is 0 (false), and the value after is '' (also false).

This means:

• 1. As long as the value before && is false, regardless of whether the value after && is true or false, the result will return the value before &&.
• 2. As long as the value before && is true, regardless of whether the value after && is true or false, the result will return the value after &&.

Let's summarize:

• 1. As long as the value before || is false, regardless of whether the value after || is true or false, the result returns the value after ||.
• 2. As long as the value before || is true, regardless of whether the value after || is true or false, the result returns the value before ||.
• 3. As long as the value before && is false, regardless of whether the value after && is true or false, the result will return the value before &&.
• 4. As long as the value before && is true, regardless of whether the value after && is true or false, the result will return the value after &&.

From the above two tests, the logical operators || and && both follow the short-circuit principle. As long as the truthiness of the value before the symbol is determined, the return value can be determined.

It should be noted that && has higher precedence than ||. Test below:

alert(1||'a'&&2);

The returned result is 1.

According to the proof by contradiction principle, we assume that the precedence of || is not lower than && (the reason for using "not lower" here is to also prove the case where they have the same precedence).

According to conclusion (1) we derived above, (1 || 'a') will return the preceding value 1; according to conclusion (4), (1 && 2) should return the following value 2. This is obviously incorrect. From this, we can see that && has higher precedence than ||.

Source URL: http://www.cnblogs.com/pigtail/archive/2012/03/09/2387486.html