Use === Instead of ==
JavaScript utilizes two different kinds of equality operators: === | !== and == | != It is considered best practice to always use the former set when comparing.
“If two operands are of the same type and value, then === produces true and !== produces false.” - JavaScript: The Good Parts
However, when working with == and !=, you’ll run into issues when working with different types. In these cases, they’ll try to coerce the values, unsuccessfully.
Don’t Use Short-Hand
Technically, you can get away with omitting most curly braces and semi-colons. Most browsers will correctly interpret the following: “‘js
if(someVariableExists) x = false
However, consider this:
if(someVariableExists) x = false anotherFunctionCall(); One might think that the code above would be equivalent to:
if(someVariableExists) { x = false; anotherFunctionCall(); } Unfortunately, he’d be wrong. In reality, it means:
if(someVariableExists) { x = false; } anotherFunctionCall();
”’ As you’ll notice, the indentation mimics the functionality of the curly brace. Needless to say, this is a terrible practice that should be avoided at all costs. The only time that curly braces should be omitted is with one-liners, and even this is a highly debated topic.
if(2 + 2 === 4) return ‘nicely done’; Always Consider the Future What if, at a later date, you need to add more commands to this if statement. In order to do so, you would need to rewrite this block of code. Bottom line - tread with caution when omitting.
The Fastest Way to Build a String
Don’t always reach for your handy-dandy “for” statement when you need to loop through an array or object. Be creative and find the quickest solution for the job at hand.
Comment Your Code
It might seem unnecessary at first, but trust me, you WANT to comment your code as best as possible. What happens when you return to the project months later, only to find that you can’t easily remember what your line of thinking was. Or, what if one of your colleagues needs to revise your code? Always, always comment important sections of your code.
Embrace Progressive Enhancement
Always compensate for when JavaScript is disabled. It might be tempting to think, “The majority of my viewers have JavaScript enabled, so I won’t worry about it.” However, this would be a huge mistake.
Have you taken a moment to view your beautiful slider with JavaScript turned off? (Download the Web Developer Toolbar for an easy way to do so.) It might break your site completely. As a rule of thumb, design your site assuming that JavaScript will be disabled. Then, once you’ve done so, begin to progressively enhance your layout!
Always Use Semicolons
Technically, most browsers will allow you to get away with omitting semi-colons.
var someItem = ‘some string’ function doSomething() { return ‘something’
Self-Executing Functions
Rather than calling a function, it’s quite simple to make a function run automatically when a page loads, or a parent function is called. Simply wrap your function in parenthesis, and then append an additional set, which essentially calls the function.