What are the truthy and falsy values in AngularJS?

Question

I think it will be considered in the context of ng-show or ng-class? Are there other situations? It seems truthy and falsy are different from pure JavaScript slightly -- but the only one exception I know of so far is [] -- which is truthy in JavaScript but falsy in AngularJS.

(actually, I tried using AngularJS 1.2.1 and [] is falsy, while on AngularJS 1.4.8 and 1.5.0, [] is truthy. see https://jsfiddle.net/6ayaLhbk/ , https://jsfiddle.net/6ayaLhbk/1/ , and https://jsfiddle.net/6ayaLhbk/2/)

I think it has a catch that one may think ng-show="ctrl.foo" is the same as ng-hide="!ctrl.foo" but in the case of Angular 1.2.1, it is not. To get the identical result of pure JavaScript in Angular 1.2.1, seems like we can use ng-show="!!ctrl.foobar" https://jsfiddle.net/6ayaLhbk/3/

If it is ng-class in Angular 1.2.1, then it seems like it goes back to the pure JS truthy and falsy rule: https://jsfiddle.net/6ayaLhbk/5/

Answer 1

The following values are always falsy:

• false
• 0 (zero)
• "" (empty string)
• null
• undefined
• NaN (a special Number value meaning Not-a-Number!)

All other values are truthy, including "0" (zero in quotes), "false" (false in quotes), empty functions, empty arrays, and empty objects.

var a = !!(0); // variable is set to false
var b = !!("0"); // true

Comparing Falsy Values Falsy values follow some slightly odd comparison rules which can lead to errors in program logic.

The falsy values false, 0 (zero), and "" (empty string) are all equivalent and can be compared against each other:

var c = (false == 0); // true
var d = (false == ""); // true
var e = (0 == ""); // true

The falsy values null and undefined are not equivalent to anything except themselves:

var f = (null == false); // false
var g = (null == null); // true
var h = (undefined == undefined); // true
var i = (undefined == null); // true

Finally, the falsy value NaN is not equivalent to anything — including NaN!

var j = (NaN == null); // false
var k = (NaN == NaN); // false

You should also be aware that typeof(NaN) returns "number". Fortunately, the core JavaScript function isNaN() can be used to evaluate whether a value is NaN or not.

If in doubt… Use strict equal (===) and strict not equal (!==) in situations where truthy or falsy values could lead to logic errors. These operators ensure that the objects are compared by type and by value.

var l = (false == 0); // true
var m = (false === 0); // false