Maison> interface Web> js tutoriel> le corps du texte

Journée - Certification professionnelle des fondations avaScript par Mozilla

WBOY
Libérer: 2024-08-29 13:02:09
original
812 Les gens l'ont consulté

Day - avaScript Foundations Professional Certification by Mozilla

Points forts du concept :

  1. Utilisation defor...ofetfor...inboucles
  2. Différences entreSet()etArray,Map()etObjectsetSet()etCarte()

1. Utilisation des boucles for...of et for...in

Le bouclage est un concept fondamental en programmation, permettant d'exécuter plusieurs fois un bloc de code. En JavaScript, for...of et for...in sont deux boucles couramment utilisées, mais elles servent à des fins différentes. Comprendre les différences peut vous aider à écrire un code plus efficace et efficient.

1.1 pour...de boucle

La boucle for...of est utilisée pour parcourir des objets itérables, tels que des tableaux, des chaînes, des cartes et des ensembles. Il fournit un moyen simple d'accéder à chaque valeur de la séquence sans avoir à se soucier de l'index.

par exemple)

let teams = ['Red Sox', 'Dodgers', 'Padres']; for (let team of teams) { console.log(team); } // Output: // Read Sox // Dodgers // Padres
Copier après la connexion

Dans cet exemple, for...of accède directement à chaque élément (équipe) du tableau teams et l'enregistre dans la console. Cette boucle est idéale lorsque vous n'avez besoin que des valeurs et non des indices.

1-2. pour...dans la boucle

La boucle for...in, quant à elle, est utilisée pour parcourir les propriétés (clés) d'un objet. Il est souvent utilisé avec des objets, mais il peut également être utilisé avec des tableaux pour accéder aux index.

par exemple)

let Mariners = {place: 'Seattle', league: 'American', color: 'navy blue'}; for (let key in Mariners) { console.log(`${key}: ${Mariners[key]}`); } // Output: // place: Seattle // league: American // color: navy blue
Copier après la connexion

Dans cet exemple, for...in parcourt les clés de l'objet Mariners, permettant d'accéder à la fois à la clé et à la valeur correspondante. Il est important de noter que for...in doit être utilisé avec prudence avec les tableaux, car il parcourt toutes les propriétés énumérables, pas seulement les indices numériques.

1-3. Différences clés

  • Objectif :
    • for...of : parcourt les valeurs d'un objet itérable (tableaux, chaînes, ensembles, cartes).
    • for...in : parcourt les propriétés énumérables (clés) d'un objet.
  • Cas d'utilisation :
    • À utiliser pour... lorsque vous devez accéder directement aux valeurs.
    • Utilisez pour...in lorsque vous avez besoin d'accéder à des clés ou à des noms de propriétés.

2. Différences entre Set() et Array, Map() et Objects, et Set() et `Map()

JavaScript fournit une variété de structures de données, chacune avec ses forces et ses faiblesses. J'ai exploré les différences entre certains des plus couramment utilisés :

2-1. Set() vs tableau

  • Unicité :
    • Set() stocke des valeurs uniques, ce qui signifie qu'aucun doublon n'est autorisé.
    • Le tableau autorise les valeurs en double.
  • Commander :
    • Set() itère l'ordre d'insertion.
    • Le tableau conserve également l'ordre d'insertion, mais les doublons peuvent modifier la façon dont vous interagissez avec lui.

par exemple)

`

let mySet = new Set([1, 2, 3, 3, 4]);
laissez myArray = [1, 2, 3, 3, 4];

console.log(mySet) // Sortie : Set { 1, 2, 3, 4 >
console.log(myArray) // Sortie : [1, 2, 3, 3, 4]

`

Dans cet exemple, le Set() supprime automatiquement les doublons3, tandis que le Array les conserve. Set() est utile lorsque vous avez besoin d’une collection d’éléments uniques.

2-2. Carte() vs objet

  • Types de clés :

    • Map() : les clés peuvent être de n’importe quel type, y compris les objets, les fonctions et les types primitifs.
    • Objet: les clés sont généralement des chaînes ou des symboles.
  • Commande :

    • Map()conserve l'ordre d'insertion.
    • Objetne garantit pas l'ordre des clés.
  • Taille :

    • Map()a une propriétésizequi donne le nombre de paires clé-valeur.
    • Objectnécessite de déterminer manuellement la taille en parcourant les clés.

par exemple)

`
let myMap = new Map();
maCarte.set('nom', 'Jean');
maMap.set(42, 'La réponse');
myMap.set({}, 'Objet vide');

laisser monObjet = {
nom : 'Jean',
42 : 'La réponse',
{} : 'Objet vide'
};

console.log(myMap.size); // Sortie : 3
console.log(Object.keys(myObject).length); // Sortie : 2 (en raison de la conversion de la chaîne de clé)
`
Dans cet exemple, Map() permet l'utilisation d'une variété de types de clés, tandis que les clés d'objet sont converties en chaînes. De plus, Map() fournit facilement la taille de la carte, alors que pour les objets, vous devez compter manuellement les clés.

2-3. Set() contre Map()

  • Objectif :
    • Set()est une collection de valeurs uniques.
    • Map()est une collection de paires clé-valeur.
  • Cas d'utilisation :
    • Utilisez Set() lorsque vous devez stocker une liste d'éléments uniques.
    • Utilisez Map() lorsque vous devez associer des valeurs à des clés.

par exemple)

`
let mySet = new Set([1, 2,3]);
let myMap = new Map([['key1', 'value1'], ['key2', 'value2']]);

console.log(mySet.has(2)); // Sortie : vrai
console.log(myMap.get('key1')); // Sortie : 'valeur'1
`
Dans cet exemple, Set() est utilisé pour vérifier l'existence d'une valeur, tandis que Map() est utilisé pour récupérer une valeur associée à une clé.

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!

source:dev.to
Déclaration de ce site Web
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
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!