Home & blog  /  Tag: data  /

Twisted logic: understanding truthy and falsy

posted: 25 Apr '11 10:00 tags: truthy, falsy, logic, Javascript, data coercion

An upcoming article I'll be doing for Smashing Magazine will look at the oddities and gotchas of Javascript - and lordie does it have a few.

One of these is the concept of truthy and falsy. These are sort of like true/false-lite, which will anger you somewhat if you majored in logic or philosophy. You mean you didn't know true and false were in fact gradable, not absolute concepts!?

In Javascript, every value has an in-built flag denoting its boolean equivalent. This is called upon when you ask the value to behave like a boolean, e.g. by comparing it to a real boolean. Javascript coerces your value into a boolean, such that the comparison is possible (after all, you can't compare apples with pears). See below for more on data coercion. So:

1var someVar = 0;

2alert(someVar == false); //evaluates true

Since we are attempting to compare zero to a boolean, Javascript coerces the zero to its truthy/falsy equivalent - and zero is a falsy (along with null, undefined, NaN, empty strings and false - everything else is a truthy). So the expression effectively becomes:

alert(false == false); //evaluates true, of course

It's important to realise that this does not mean your value is a boolean - it simply means Javascript temporarily converts it to a boolean to make the comparison possible. If we did the same comparison with the === operator (which compares not only by value but also by type), the result would be different:

alert(someVar === false); //evaluates false - someVar is a number, not a legitimate boolean

It gets worse

Clear enough? It gets more complex.

A well known quirk of Javascript is that an empty array appears to be equal to false.

alert([] == false); //evaluates true

How can this be, if an empty array is a truthy? (it is often mistakenly stated as being a falsy).

Er, good question. This throws up an interesting point in Javascript: that testing values against booleans and testing them alone inside a condition, does not always return the same thing. Here's what I mean:

1alert([] == true); //evaluates false

2alert([]); //evaluates true - so an empty array is a truthy

Thus, the latter approach really shows what is and isn't a truthy/falsy.

Data coercion

As I touched on above, Javascript does what's called data coercion. It's important to understand this in order to properly understand truthy and falsy.

This might sound new to you, but chances are you've experienced it before. The most common example is when you output an array.

alert(['one', 'two', 'three']); //alerts('one,two,three');

You didn't ask Javascript to convert the array to a string - except you did, when you alerted it. An array cannot itself be output, so Javascript coerces it into its string format.

Internally, what happens here is it calls the array's toString() method, which in turn calls the join() method. Both of these are present automatically on every array, due to Javascript's prototypal inheritance. That's a separate blog post if ever there was one...

Avoiding coercion

If you want to be strict in your comparisons and avoid data coercion you should use the comparison operator ===, which compares not only value but also type.

Hope you found this helpful.

post a comment

posted: 02 Dec '10 18:55 tags: XML, JSON, remap, convert, data, AJAX, jQuery

I've had a great response to my XML-to-JSON convertor and remapper. Its ability to not only convert but also remap data on the fly, to your precise structural requirements, has gone down particularly well.

One flaw raised today, though, was that it didn't work with RSS fees. Standard XML feeds, yes, but not RSS. After some digging I realised why.

The plugin expected the iteration node (i.e. the repeated node whose data will form the sub-objects of your JSON data) to directly follow the root node, e.g.

1

2    

3         foo

4         bar.html

5    

6

But if your XML had more levels - such as the following, typical of RSS:

1

2    

3        

4             foo

5             bar.html

6        

7    

8

...it didn't play ball. This has been countered by the addition of a new second argument when calling the plugin, in which you pass a space-separated selector string matching the iteration node, so for the above two examples this would be 'root news_story' and 'rss channel news_story', respectively.

Happy days! to download, get usage info or view a demo.

I've also been asked about whether the plugin supports XML node attributes. No, but it will. Stay posted...

XML-to-JSON convertor and remapper

posted: 24 Nov '10 22:45 tags: XML, JSON, remap, convert, data, AJAX, jQuery

After much hair-pulling and cursing, my XML-to-JSON convertor and remapper is finally here.

The real power behind this plugin is its ability to not only convert but also REMAP your data on the fly. There are other plugins out there that handle conversion, but I've not seen any that also remap.

This has the potential to be hugely useful.

Imagine you're using a news ticker that requires JSON data (for the headlines, URLs etc), but you want to populate it with data from an XML feed you don't have control over, and whose property names and hierarchical structure is different from what your ticker needs:

1

2     foo

3     bar

4    

5         foobar

6    

7

but you need

1{

2     one: 'foo',

3     two: 'bar',

4     three: 'foobar'

5}

...so not only a conversion but also a structural change. You can achieve that with this plugin.

Head over here to download, get usage info or view a demo.

post a comment