Javascript Jems - active logic, truthy and falsey
Thursday, 17 June 2010 12:50
Article Index
Javascript Jems - active logic, truthy and falsey
Lazy evaluation, &&,! and ternary

Banner

 

The traditional way of thinking about Boolean or logical operators is in terms of a truth table. For example the truth table for the Or operation i.e. || in Javascript is:

 

A B A||B
F F F
F T T
T F T
T T T

 

with T=true and F=false.

If you try this out using:

A=true;
B=false;
if(A||B)alert("The expression is TRUE");

you will see that the result is indeed true as the line starting T,F suggests.

The first difference between Javascript and other languages is the fact that it uses a concept of "truthiness" and "falsiness".

All values in Javascript can be treated as if they were Boolean values.

Any zero, null, undefined or null string are falsey and behave in logical expressions as if they were false and everything else is truthy and behave in logical expressions as if they were true.

So for example you can write

A=20;
B=null;
if(A||B)alert("The expression is TRUE");

and still see the TRUE message displayed because A is set to a truthy value and B is set to a falsey value which results in a truthy value.

However things are even stranger than just truthy and falsey. Take a look at the logical table for OR again:

 
A B A||B
F F F
F T T
T F T
T T T

 

You could interpret it as saying

"return the first value if it is true and return the second value otherwise".

This rule gives you exactly the same truth table when the values are Boolean but consider what you get if the first value is numeric with 0 and 20 being falsey and truthy and the second is a string  with "" and "Hello" being falsey and truthy:


A B A||B
0 "" ""
0 "Hello"
"Hello"
20 "" 20
20 "Hello" 20

 

This looks very strange but you can see that A||B returns B if A is falsey and A if A is truthy.

Another way of looking at this that A||B is equivalent to an if statement. That is:

 A||B;

is the same as

if(!A){B};

or, if you want to avoid the use of the NOT ! operator (see later) you could write the valid but unusual:

 if(A) {} else {B};

For example:

 A=2*6+9;
B=null;
alert(A || B);

displays 21 because the first variable is truthy but:

 A=null;
B="hello";
alert(A || B);

displays "hello" because A is falsey.

This last example also gives us some idea of what this could be use for - default values. For example, consider the following function:

 function test(a)
{
a=a||"default value";
alert(a);
}

If you don't remember to, or don't want to, set the a parameter then it is undefined when the function starts to run and hence it is falsey and a is set to "default value". That is:

 test();

results in "default value" being displayed. If you set the parameter then it is a truthy value and a remains unchanged. Notice however that if you pass in a falsey value such as the null string "" or 0 then these will also be replaced by the default value which might not be not what you intended.

Banner

<ASIN:0596517742>

<ASIN:0321572602>

<ASIN:0596806752>

<ASIN:0596517742>

<ASIN:1590597273>

<ASIN:059680279X>

<ASIN:0596805527>



Last Updated ( Monday, 09 August 2010 16:33 )
 
 

   
RSS feed of all content
I Programmer - full contents
Copyright © 2013 i-programmer.info. All Rights Reserved.
Joomla! is Free Software released under the GNU/GPL License.