Clean Code in JavaScript — Part 1

17 clean code tips (JavaScript) that every developer should know!!

Raghav Bang
RaghavBang
Published in
4 min readOct 30, 2022

--

Writing clean code increases developer productivity and the application’s maintainability. However, some developers unknowingly make straightforward mistakes that degrade the quality of the code.

In this article, I will discuss few standard practices that one can follow to write clean code.

  1. Avoid mental mapping. Explicit is better than implicit.

Ex: Explicit Type conversion

2. Follow “Plural Singular rule”.

It will help other developer to understand the code very easily.

3. Use (array || [ ]).function

If the array is not present, the empty array will be used. It will make your code more robust.

4. Use default parameters.

Instead of doing short circuiting or using conditions, we can use default parameters.

5. Function Arguments

Ideally a function should have not more than 3 parameters.

  • If your function is having more than 3 parameters, then try to divide the logic of that function into multiple functions.
  • Function should always do single task. That makes unit testing super easy for you.
  • In case you are unable to reduce the number of parameters then pass all the arguments as an object and use destructing syntax in function.

6. Remove Duplicate Code.

It means that if you have same code at multiple places then while making changes at one place you need to take care of all other places.

7. Don’t send a flag as a function parameter, which will decide what the function will do.

It eventually tells that the function is doing multiple tasks based on flag value. Whereas a function should do single task.

8. Try to write pure functions. And follow immutability principle.

A function is said to be pure function if:

  • If it has one argument
  • If it returns a value/function
  • Doesn’t mutate the state of input or any global variable
  • For same input, same output

To follow immutability principle, always return a new copy of data.

9. ES6 supports extending the global Array/ Object.

So, while creating polyfills/global function use “class SuperArray extends Array{}” instead of Array.prototype. Because using Array.prototype. might clash with another library function name.

10. Avoid using negative conditions.

11. If possible, encapsulate the condition.

12. While writing Unit Tests, try to write single test case in one *it* block.

13. Use try and catch for error handling.

But don’t ignore the catch block. Send some notifications to user as well as to server in catch block.

14. If a function calls another function, then keep those functions vertically close as we tend to read code from top to bottom, so keep the caller right above the callee.

15. Use consistent naming convention and always format your code.

16. Don’t use datatype name in variable name. Use TypeScript to add type to variable.

17. Comment things that have complex business logic.

Final Thoughts

In this article, I discuss how we can write clean code by following simple rules. But it's not always possible to practice all rules, as each team, has it’s own standard.

As developers, we should always write clean code since it increases readability and makes it easier for you and your team to understand the code.

I hope those suggestions will help you improve the readability of your code and if you have any suggestions, please share them with others in the comments section.

If you like this post and find it helpful you can give me claps and do, follow me😍!!

Clean Code in JavaScript — Part 2: Clean Code in JavaScript — Part 2 | by Raghav Bang | RaghavBang | Dec, 2022 | Medium

Ref:

  1. ryanmcdermott/clean-code-javascript: Clean Code concepts adapted for JavaScript (github.com)
  2. Clean Code in JavaScript: Develop reliable, maintainable, and robust JavaScript by James Padolsey
  3. Clean Code by Robert Martin

--

--