Stop using “var” and Consider Using “let” and “const”…
Declarations with “var” are also hoisted which makes var declarations accessible before where the declarations happened, which is non-obvious behaviour.
The “let” keyword allows us to create local variables that are scoped within their own block. The “const” keyword allows us to create local block-scoped variables whose value cannot be reassigned.
So, use the “let” and “const” keywords in appropriate situations while declaring your variables.
Organize your declarations
Be consistent with the way you declare things. Put all your declarations on top starting with the constants down to the variables. Make constants all uppercase to indicate they are constants which will prevent devs from trying to change them.
Comment Your Code
Add comments when you did something not common or require context to be understood. Also, add comments to things that are a hack or may require improvements/fixing later on so the next person knows why. Add comments in your third parties’ modules and modules in your codebase to explain the architecture and the intention behind things.
Use === Instead of ==
- strict operators ( ==== and !== )
- non-strict operators ( == and != )
While using non-strict operator, you will get an issue when you have different data types. So, it is always best practice
To use strict operator.
Destructuring makes it more obvious what you need from arrays and objects. It also gives you the opportunity to rename things which gives more sense to your code.
Use the Spread Operator
Have you ever been in a situation where you wanted to pass all the items of an array as individual elements to some other function or you wanted to insert all the values from one array into another? The spread operator (…) allows us to do exactly that.
Prefer promises over callbacks
async and await
You can use the async keyword to create asynchronous functions, which always return a promise either explicitly or implicitly. Asynchronous functions that you create can take advantage of the await keyword by stopping execution until the resolution of returned promises. The code outside your async function will keep executing normally.
Use Arrow Functions
Another notable benefit of arrow functions is that they do not define a scope, instead being within the parent scope. This prevents many of the issues that can occur when using the this keyword. There are no bindings for this in the arrow functions. this has the same value inside the arrow function as it does in the parent scope. However, this means arrow functions can’t be used as constructors or methods.
For loops > .forEach sometimes
Don’t change things into an array just so you can “.forEach” it. You are adding an extra process to a slow alternative. Loops are faster and allow you to use the “continue” and “break” keywords to control the looping.
Avoid nesting or chaining loops
When you chain iteration method or nest loops you are increasing the complexity of the code which may slow things down later on or as your data grows. Even though some operations may require it, always assess your looping strategy to ensure you don’t have unnecessary loops or loops that can be combined together.
Always “try…catch” JSON methods
Don’t trust things passed to JSON methods “.stringify” and “.parse”. Try to catch them to make sure they don’t fail and break your code.
Add semicolons, always!
jQuery’s each() method is great for looping, but using a native for statement will always be an ounce quicker.