or even an empty array. Any value that acts as though it were the Boolean value true in this type of context is called truthy, and any value that acts like false is called falsy.
JavaScript treats all these values as truthy:
true
1 (because it’s a non-zero number)
"0" (because it’s a non-empty string)
"false" (because it’s a non-empty string)
function() {} (any function)
{} (any object)
[] (any array)
And these values are falsy:
false
0 (the number zero)
"" (an empty string)
null
undefined
NaN (a special number value meaning Not a Number)
These values can be combined with the logical NOT operator to great effect. A single exclamation mark is used:
var a = 0;
var b = 1;
if (!b) {
// do something
}
else if (!a) {
// do something else
}
The logical NOT operator returns true if the value of the variable is false and, conversely, it will return false if the value is true. In the example above, b is truthy and so !b returns false, and a is falsy so !a returns true—so the code in the else if block would execute.
It’s important to remember that while a value may be == true, it may only be truthy, and not strictly true:
var a = true;
var b = 1;
alert(a == b);// alerts true
alert(a === b);// alerts false
alert(a != b); // alerts false
alert(a !== b); // alerts true
If you have the option, always elect to use the Boolean values of true and false. If there’s one thing that’s undoubtedly true, it’s that hunting down a truthy or falsy logic error is truly painstaking!
Appendix C. Plugin Helpers
There are a few jQuery properties and actions that, although applying to any jQuery selection, are particularly useful for plugin development. The reason they’re hidden away in this appendix is that they’re uncommonly used. Despite this, they’re quite powerful, and you should familiarize yourself with them if you intend to spend time developing plugins.
Selector and Context
The first ones we’ll look at are the selector and context properties. These work together to show you what jQuery thinks it’s working on.
The selector property returns a string value of the current jQuery selector string: so the command $('p:first').selector will return the string "p:first". This is useful in your plugins if you need to know what the user originally selected.
You might think that the optional second parameter to the jQuery selector, which is called context, is what you’d obtain with the context property—but it’s a bit trickier than that. In fact, if you supply context as a string, it’s converted internally to a regular jQuery statement, which will actually affect the selector property:
var selector = $('p:first', '#content').selector
var context = $('p:first', '#content').context
In the above example, the selector resolves to "#content p:first" and the context resolves to Document (the context that all your selectors will default to). The context property is only modified if you supply an actual DOM node to it:
var domContext = $('#content')[0]; // Get the DOM element
var selector = $('p:first', domContext).selector;
var context = $('p:first', domContext).context;
In this case, the selector will be reported as "p:first", and the context will be the DOM element itself (for this example, it’s the
element).
Specifying the DOM node provides no guarantee that your queries will run faster; internally jQuery’s selector engine will only search inside the context you specify anyway, even though the context property will be reported as Document.
The jQuery Stack
To make our plugins play nicely with jQuery, we’ve learned that we should return each jQuery element from our code, so that commands can continue to be chained after our plugin. Generally, we just modify elements in the selection before we pass them back, but sometimes we want to alter the items that are returned—perhaps remove some elements, or add some new ones. The best way to accomplish this is via the pushStack action. This is a convenient way to create a jQuery selection for inclusion in the chain.