Question

Using a watermark plugin for jQuery, I’m attempting to jslint and minimize the functions but I’ve come across syntax I have never seen before wherein there are expressions where there really ought to be an assignment or function call:

(function($) {

    $.fn.watermark = function(css, text) {

        return this.each(function() {

            var i = $(this), w;

            i.focus(function() {
                w && !(w=0) && i.removeClass(css).data('w',0).val('');
            })
                .blur(function() {
                    !i.val() && (w=1) && i.addClass(css).data('w',1).val(text);
                })
                .closest('form').submit(function() {
                    w && i.val('');
                });

            i.blur();
        });
    };

    $.fn.removeWatermark = function() {

        return this.each(function() {

            $(this).data('w') && $(this).val('');
        });
    };
})(jQuery);

I’m specifically interested in the following lines:

w && !(w=0) && i.removeClass(css).data('w',0).val('');

and

!i.val() && (w=1) && i.addClass(css).data('w',1).val(text);

Can someone explain this shorthand and rewrite these functions in such a way that I could compare them to better to understand the shorthand myself?

Thank you.

Answer 1

Let’s break each of the statements you’re asking about down to their components:

w && !(w=0) && i.removeClass(css).data('w',0).val('');

• w – Is w “true”? (checking for != 0 in this case)
• !(w=0) – Set w to 0, take the opposite of the result so the && chain continues
• i.removeClass(css).data('w',0).val('') – Remove the class, set the data to 0 clear the value.

---

!i.val() && (w=1) && i.addClass(css).data('w',1).val(text);

• !i.val() – Is the input empty?
• (w=1) – Set w to 1
• i.addClass(css).data('w',1).val(text); – Add the class, set the data to 1 and set the text to whatever the watermark text is.

---

Both of these are just statements to really cut down on code, certainly at the expense of readability. If you’re looking at a de-minified version this is very common, if you’re not and this is the original, chase the author with a salad fork, the original should be more more readable than this IMO, though it’s just fine for a minified version.