Hey, developers! Let’s go back to our early coding days, when we were worried to dominate the digital world.
Remember when your tech leaders were busy with “cleaning” the code? You may have thought they were on a coding cleansing, but they were actually onto something serious.
The Clean Code Challenge starts.
Imagine you’re a junior developer in a team led by coding experts who are very interested in clean code.
They want code so simple that even your grandmother can understand it!
What is their goal? To make the code as plain as the nose on your face, reflecting exactly how you handled the user stories.
In other words, they want code that is clear, concise, and easily understandable.
Code Clarity Explained
So, how can we get the legendary code cleanliness? It’s easier than you think!
Let’s break down some key rules:
1. Make Names Great Again
Forget one-letter variable names like “n” and “l”.
Instead, choose names that are descriptive like “firstNamePhysician” and “lastNamePhysician”.
For more clarity, start functions with verbs like “getPhysicianName”.
// Bad Naming
const n = 'John'
const l = 'Doe'
// Good Naming
const lastNamePhysician = 'John'
const firstNamePhysician = 'Doe'
2. Empty Lines Are Your Friend
Don’t be worried about adding blank lines to break up the text.
They offer a breathing area for your code, making it easier to read and understand.
// Code without empty lines
function calculateTotalPrice(itemList) {
let totalPrice = 0;
for (let i = 0; i < itemList.length; i++) {
totalPrice += itemList[i].price;
}
return totalPrice;
}
// Code with empty lines
function calculateTotalPrice(itemList) {
let totalPrice = 0;
for (let i = 0; i < itemList.length; i++) {
totalPrice += itemList[i].price;
}
return totalPrice;
}
3. Keep Functions Simple
Avoid functions that take more than three parameters.
If you need more, consider combining them into an item.
Trust me, your brain will thank you.
// Example 1: More than Three Parameters
function calculateTotal(item1, item2, item3, item4, item5) {
const total = item1 + item2 + item3 + item4 + item5;
return total;
}
// Example 2: Less than Three Parameters (Refactor)
function calculateTotal(itemPrices) {
const total = itemPrices.reduce((acc, price) => acc + price, 0);
return total;
}
4. One Function, One Job
Imagine functions as worker bees, with each having a specific duty.
Multiple little functions are always better than a single large one.
// Example 1: Multiple Functions with Single Responsibilities
function calculateSquare(number) {
return number * number;
}
function calculateCube(number) {
return number * number * number;
}
function printMessage(message) {
console.log(message);
}
// Example 2: A Single Function with Multiple Responsibilities
function calculateAndPrintSquareAndCube(number) {
const square = number * number;
const cube = number * number * number;
const message = `The square of ${number} is ${square}, and the cube is ${cube}.`;
console.log(message);
}
6. Short and Sweet Functions
Functions should be clear and focused, similar to a well-written tweet.
If yours is multi-screen, it’s time to break it down.
7. Mind Your Line Length
Long lineups are like trying to pack a giraffe in a Mini Cooper — they don’t work.
Keep your lines short, and avoid horizontal scrolling. Prettier is a tool that might help with formatting.
8. Say No to Comments (Unless Necessary)
If your code needs important comments to be understood, it means something is wrong.
Strive for straightforward code with clear function names and useful variable names.
9. The Mighty Unit Test
Unit testing may seem like a pain, but it is your code’s greatest friend.
It guarantees that your code works exactly as it should, saving you and future developers problems.
10. Design Patterns
Design patterns are like superhero blueprints, offering battle-tested answers to common code issues.
Use these patterns to create efficient and maintainable code
Final Words
Remember, developers: the code we create is not just for us. It’s for the developers who follow us.
Let us leave a legacy of code that is clean, readable, and manageable, making people blush rather than shout.
Now, go on and write some brilliantly awesome code!