Aprende Best Practices for Readable Code | Applying Logic and Writing Clean Code

When writing JavaScript logic, your goal should always be to make your code as readable and understandable as possible. This not only helps others who read your code, but also makes it easier for you to spot mistakes and maintain your programs over time. There are several best practices you can follow to achieve this.

First, always use clear and descriptive variable names. A variable like isUserLoggedIn is much easier to understand than something vague like x or flag.

Second, keep your indentation consistent. Indenting your code properly shows the structure of your logic, making it much easier to see which statements belong together, especially inside conditional statements and loops.

Finally, if you have a complex condition—for example, a long if statement with multiple checks—consider breaking it up into smaller, named variables or helper functions. This makes each part of your logic clear and your overall code much easier to follow.


              1234567891011121314151617181920212223242526272829
            
// Messy code: hard to read and understand
let x = 10;
let y = 15;
let z = 7;
let a;

if ((x == 10 && y != 20) || z > 5) {
  a = 1;
} else {
  a = 2;
}

console.log("Messy code result:", a);

// Clean code: readable and clear
const isTen = x === 10;
const notTwenty = y !== 20;
const greaterThanFive = z > 5;

if ((isTen && notTwenty) || greaterThanFive) {
  a = 1;
} else {
  a = 2;
}

console.log("isTen:", isTen);
console.log("notTwenty:", notTwenty);
console.log("greaterThanFive:", greaterThanFive);
console.log("Clean code result:", a);

¿Todo estuvo claro?

¡Gracias por tus comentarios!

Sección 3. Capítulo 2

Pregunte a AI

Pregunte lo que quiera o pruebe una de las preguntas sugeridas para comenzar nuestra charla

Awesome!

Completion rate improved to 7.69

Desliza para mostrar el menú

First, always use clear and descriptive variable names. A variable like isUserLoggedIn is much easier to understand than something vague like x or flag.


              1234567891011121314151617181920212223242526272829
            
// Messy code: hard to read and understand
let x = 10;
let y = 15;
let z = 7;
let a;

if ((x == 10 && y != 20) || z > 5) {
  a = 1;
} else {
  a = 2;
}

console.log("Messy code result:", a);

// Clean code: readable and clear
const isTen = x === 10;
const notTwenty = y !== 20;
const greaterThanFive = z > 5;

if ((isTen && notTwenty) || greaterThanFive) {
  a = 1;
} else {
  a = 2;
}

console.log("isTen:", isTen);
console.log("notTwenty:", notTwenty);
console.log("greaterThanFive:", greaterThanFive);
console.log("Clean code result:", a);

¿Todo estuvo claro?

¡Gracias por tus comentarios!

Sección 3. Capítulo 2