Maison >interface Web >js tutoriel >Mon parcours React : jour 10

Mon parcours React : jour 10

Patricia Arquette
Patricia Arquetteoriginal
2024-12-15 05:02:21213parcourir

My React Journey: Day 10

Fonctionnalités ES6

Ce que j'ai appris aujourd'hui

JavaScript moderne (ES6 et au-delà) a introduit des fonctionnalités qui ont rendu le langage plus puissant, plus lisible et plus convivial pour les développeurs. Voici un résumé :

  1. Modèles littéraux
  • Ce qu'il fait : permet l'interpolation de chaînes et les chaînes multilignes.

  • Exemple :

let year = 2024;
console.log(`This is year ${year}`);
  • Avantages : Plus facile à lire et à gérer les chaînes par rapport à la concaténation traditionnelle.
  1. Fonctions fléchées
  • Ce qu'il fait : fournit une syntaxe plus courte pour l'écriture de fonctions.

  • Exemple :

let add = (a, b) => console.log(`${a} + ${b} = ${a + b}`);
add(4, 5); // Output: 4 + 5 = 9
  • Avantages : simplifie le code, en particulier pour les fonctions en ligne.
  1. Paramètres par défaut
  • Ce qu'il fait : attribue des valeurs par défaut aux paramètres de fonction si aucun argument n'est passé.

  • Exemple :

function callMe(name = "Damilare") {
    console.log(`My name is ${name}`);
}
callMe(); // Output: My name is Damilare
callMe("Ayoola"); // Output: My name is Ayoola
  • Avantages : empêche les erreurs dues aux paramètres manquants.
  1. Déstructuration
  • Ce qu'il fait : extrait les valeurs de tableaux ou d'objets et les affecte à des variables. Exemples :
//Array Destructuring:
const [a, b] = [2, 3];
console.log(a, b); // Output: 2 3

//Object Destructuring:
const { age, year } = { age: 32, year: "Year 5" };
console.log(age, year); // Output: 32 Year 5
  • Avantages : rend le code plus propre et réduit l'accès répétitif aux propriétés des objets ou aux éléments du tableau.
  1. Opérateurs de propagation et de repos (...)
  • Spread : développe les éléments d’un tableau ou d’un objet en éléments individuels.
const arr1 = [0, 1, 2];
const arr2 = [...arr1, 3, 4, 5];
console.log(arr2); // Output: [0, 1, 2, 3, 4, 5]
  • Reste : collecte les éléments restants dans un seul tableau ou objet.
const collectRest = (first, ...rest) => {
    console.log(`First number is ${first}`);
    console.log(`The rest of the numbers: ${rest}`);
};
collectRest(1, 2, 3, 4); 
// Output:
// First number is 1
// The rest of the numbers: [2, 3, 4]
  1. pour...de Boucle
  • Ce qu'il fait : simplifie le bouclage sur des objets itérables (comme des tableaux).

  • Exemple :

let arr = [1, 2, 3, 4, 5];
for (let num of arr) {
    console.log(num);
}
// Output:
// 1
// 2
// 3
// 4
// 5
  • Avantages : évite d'avoir à accéder manuellement aux index des tableaux et améliore la lisibilité.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn