Maîtriser JavaScript 2/5 : astuces pour un code svelte et structuré

Comprendre et utiliser des techniques abrégées de JavaScript peut considérablement améliorer votre productivité et rendre votre code plus expressif et efficace. Dans cet article, nous explorons quelques techniques abrégées puissantes qui simplifieront votre code et le rendront plus concis.

Fonctions fléchées

Remplacez les déclarations de fonctions traditionnelles par des fonctions fléchées pour écrire un code plus concis et plus expressif.

// Fonction traditionnelle
function addition(a, b) {
  return a + b;
}

// Fonction fléchée équivalente
const addition = (a, b) => a + b;

Valeurs de paramètres par défaut

ES6 (ECMAScript 6) a introduit les valeurs de paramètres par défaut pour les fonctions, pour fournir des valeurs de repli si un argument n’est pas passé ou est indéfini.

const saluer = (nom = "Anonyme") => console.log(`Bonjour, ${nom} !`)

saluer(); // Bonjour, Anonyme !
saluer("Alice"); // Bonjour, Alice !

Évaluation à court-circuit

Utilisez des opérateurs logiques pour des déclarations conditionnelles concises afin de vérifier l’existence avant d’accéder à des propriétés ou d’appeler des fonctions.

// Sans les techniques abrégées
if (options && options.size && options.color) {
  doSomething();
}

// Avec les techniques abrégées
options?.size?.color && doSomething();

Opérateur de chaînage optionnel

L’opérateur de chaînage optionnel (?.) donne accès à des propriétés imbriquées d’un objet sans vous soucier des valeurs nulles ou indéfinies.

const utilisateur = {
  nom: "Alice",
  adresse: {
    ville: "Paris"
  }
};

const villeUtilisateur = utilisateur?.adresse?.ville; // "Paris"

Opérateur de fusion nullish

L’opérateur de fusion nullish (??) fournit une valeur par défaut en cas de rencontre de null ou d’indéfini.

const valeur = null;
const valeurParDefaut = "Valeur par défaut";

const resultat = valeur ?? valeurParDefaut; // "Valeur par défaut"

Opérateurs logiques d’affectation

Les opérateurs logiques d’affectation (&&=, ||=) combinent les opérateurs logiques avec l’affectation de manière concise.

let compteur = 5;
compteur &&= 10; // Le compteur vaut maintenant 10

let nomUtilisateur = "";
nomUtilisateur ||= "Anonyme"; // Le nomUtilisateur devient "Anonyme"

Maîtriser les techniques abrégées en JavaScript pour améliorer votre efficacité de codage et votre lisibilité. Écrivez propre et expressif tout en réduisant les répétitions inutiles. Intégrez ces techniques abrégées dans vos pratiques de codage pour devenir un développeur JavaScript plus compétent et efficace.

Apprenez-en plus sur les manière d’alléger votre code et de le structurer en consultant le premier article de la série « article pour un code Javascript svelte et structuré », ou continuez avec la suite, qui touche aux opérateurs ternaires, les méthodes sur les tableaux et les propriétés d’objets !