codeburst

Bursts of code to power through your day. Web Development articles, tutorials, and news.

Follow publication

Best Easy Practices of Javascript

--

Follow some best practices while writing your javascript code.

Who doesn’t like to follow best practices and write quality and maintainable code? Well if you don’t, that’s Ok. You will still find theses tips easy and quite helpful. And if you are enthusiastic about it, congratulations, you have landed in the right place!

Some may argue that users don’t care about code quality but more focused on results. But the code practices are created to save development time and reduce the number of bugs. So I have to disagree. Users *indirectly* care about how you write your code.

So without further ado, let’s begin.

Variables & References

  1. Use let instead of var .
let vs var

Why? Because var is function scope which could lead to some bugs in your code while let is block scope.

2. Use const instead of let when you don't have to reassign values.

According to Eslint

If a variable is never reassigned, using the const declaration is better. The const declaration tells readers, "this variable is never reassigned," reducing cognitive load and improving maintainability.

3. Always use const or let to declare variables.

Use const or let

Not doing so will result in variables declared in the global scope and polluting global namespace.

4. Don’t chain variable assignments

Avoid global variables with chaining assignments

Chaining variable assignments may seem easier to code but have repercussions associated with it. During chaining of variable assignments, implicit global variables are created which results in polluting the global namespace.

Arrays & Objects

  1. Creating new array & objects without new
Creating new array and object

While there are no performance differences between the above two approaches, the conciseness of the object literal form is what has made it the way of creating new objects

2. Use object property/method shorthand

Object property/method shorthand

ES6 provides a cleaner form of defining object literal methods and properties. Also, group your shorthand properties at the beginning of your object declaration. This syntax can make defining complex object literals much easier and more maintainable.

3. Using spread operator to shallow copy array and objects.

Shallow copy object using the spread operator

Shallow copy array using the spread operator

Shallow copy an array using the spread operator

Destructuring

  1. Use object destructuring when accessing and using multiple properties of an object.
Destructing object properties

Destructuring prevents you from creating temporary references for those properties of objects.

2. Use array destructuring

Using destructing with arrays

Functions

  1. Never declare a function in a non-function block (if, while, etc).
Assigning Function to a variable

Instead of defining a function inside a non-functional block, declare a variable and assign the function to it based on the conditions if present.

2. Prefer using the ... syntax instead of using arguments

Using Rest operator for arguments in function

Why? Because rest arguments are a real Array, and not merely Array-like like arguments.

3. Use default parameters rather than mutating the function arguments.

Using default parameters

Conclusion

That’s all for now folks! I hope the above simple practices will help you in writing clean and maintainable code throughout the project. Happy clean coding.

Sign up to discover human stories that deepen your understanding of the world.

Free

Distraction-free reading. No ads.

Organize your knowledge with lists and highlights.

Tell your story. Find your audience.

Membership

Read member-only stories

Support writers you read most

Earn money for your writing

Listen to audio narrations

Read offline with the Medium app

--

--

Published in codeburst

Bursts of code to power through your day. Web Development articles, tutorials, and news.

Written by Sarthak Aggarwal

Coder 💻 | Traveller ✈️ | F1 enthusiast 🏎

Responses (1)

Write a response