Why does JSLint tell me to use “=== undefined” instead of “typeof … === 'undefined'”?

Question

I coded the following:

showTitles = (typeof showTitles !== 'undefined') ? showTitles : 'Y';
showSelectGroup = (typeof showSelectGroup !== 'undefined') ? showSelectGroup : 'Y';

But JSLint is saying:

Warning 3 JS Lint: Unexpected 'typeof'. Use '===' to compare directly with undefined.

How should I change my code?

Answer 1

Note that whether this is best practice in general is debatable, but if you want to make it work with JSLint, you could do this

showTitles = (showTitles !== undefined) ? showTitles : 'Y';

Answer 2

Probably by using

showTitles = (showTitles === undefined) ? 'Y' : showTitles;
showSelectGroup = (showSelectGroup === undefined) ? 'Y' : showSelectGroup;

jslint has no issues with that (assuming showTitles and showSelectGroup are declared with var)

However, I'd write it as

var showTitles = showTitles || 'Y';
var showSelectGroup = showSelectGroup || 'Y';

Answer 3

This message reflects the latest best practices. As of ES5 strict mode, the global value of undefined can no longer be changed and a direct comparison is simpler code and faster. In short, JSLint is aware of all this, and is giving you good advice.

In this case, change typeof showTitles !== 'undefined' to showTitles === undefined.