Maison interface Web js tutoriel Comprendre les caractéristiques et les scénarios applicables des objets itérables intégrés de JS

Comprendre les caractéristiques et les scénarios applicables des objets itérables intégrés de JS

Jan 13, 2024 am 09:59 AM

Comprendre les caractéristiques et les scénarios applicables des objets itérables intégrés de JS

Pour maîtriser les caractéristiques et les scénarios d'application des objets itérables intégrés de JS, des exemples de code spécifiques sont nécessaires

Introduction :
Avec le développement rapide de JavaScript, de nombreuses nouvelles syntaxes et fonctionnalités ont été introduites dans le langage. L’un d’eux concerne les objets itérables. Les objets itérables jouent un rôle important dans JavaScript, fournissant un moyen concis et efficace de gérer des collections de données. Cet article présentera les caractéristiques et les scénarios d'application des objets itérables, et fournira des exemples de code correspondants.

1. Qu'est-ce qu'un objet itérable ?
L'objet Iterable (Iterable) est un objet qui peut renvoyer certaines valeurs en séquence pendant le processus de parcours. En termes simples, un objet itérable est un objet qui prend en charge les opérations itératives. ES6 introduit le protocole Iterator, qui nous permet de définir nos propres objets itérables.

2. Objets itérables intégrés dans JS
En JavaScript, il existe des objets itérables intégrés que tout le monde connaît très bien, notamment les tableaux, les chaînes et les cartes. Ensuite, nous utiliserons ces objets comme exemples pour présenter les caractéristiques et les scénarios d'application des objets itérables.

  1. Array
    Array est l'une des structures de données les plus courantes en JavaScript. Il se caractérise par sa longueur ordonnée et variable. Nous pouvons utiliser un itérateur pour parcourir chaque élément du tableau, comme indiqué ci-dessous :

1

2

3

4

5

const arr = [1, 2, 3, 4, 5];

 

for (const item of arr) {

  console.log(item);

}

Copier après la connexion

Le résultat de sortie est :

1

2

3

4

5

1

2

3

4

5

Copier après la connexion
  1. String (String)
    String est un type immuable composé de caractères. Bien qu'une chaîne ne soit pas un objet véritablement mutable, elle peut être itérée. Nous pouvons parcourir chaque caractère de la chaîne via un itérateur, comme indiqué ci-dessous :

1

2

3

4

5

const str = "Hello World!";

 

for (const char of str) {

  console.log(char);

}

Copier après la connexion

Le résultat de sortie est :

1

2

3

4

5

6

7

8

9

10

11

12

H

e

l

l

o

 

W

o

r

l

d

!

Copier après la connexion
  1. Map object
    Map est un type de collection qui stocke les données dans des paires clé-valeur. C'est également un objet itérable, et nous pouvons utiliser des itérateurs pour parcourir chaque paire clé-valeur dans la carte. Voici un exemple de traversée d'un objet Map :

1

2

3

4

5

6

7

8

const map = new Map();

map.set("name", "John");

map.set("age", 30);

map.set("gender", "male");

 

for (const [key, value] of map) {

  console.log(`${key}: ${value}`);

}

Copier après la connexion

Le résultat de sortie est :

1

2

3

name: John

age: 30

gender: male

Copier après la connexion

3. Scénarios d'application d'objets itérables
Après avoir compris les caractéristiques des objets itérables, nous pouvons appliquer cette fonctionnalité à notre développement réel . Voici plusieurs scénarios courants d'utilisation d'objets itérables :

  1. Boucle dans une collection de données
    En utilisant des itérateurs, nous pouvons facilement parcourir des éléments de données dans des tableaux, des chaînes et des cartes et traiter rapidement les données.
  2. Filtrage des données
    Les objets itérables peuvent être combinés avec des fonctions d'ordre supérieur, telles que la fonction filter(), pour implémenter le filtrage des données. Obtenez des éléments de données de manière séquentielle via l'itérateur et filtrez en fonction des conditions définies.
  3. Générer de nouvelles séquences
    En itérant sur des objets itérables, nous pouvons générer de nouvelles séquences. Par exemple, utilisez la fonction map() du tableau pour mapper le tableau d'origine, puis générez un nouveau tableau à partir du résultat du mappage.

Résumé :
Les objets itérables sont l'un des concepts très importants de JavaScript, qui fournissent un moyen efficace de gérer les collections de données. Qu'il s'agisse d'un objet tableau, chaîne ou Map, vous pouvez facilement utiliser des itérateurs pour parcourir et traiter les données. Il est très important pour les développeurs de maîtriser les caractéristiques et les scénarios d'application des objets itérables. Grâce à l'introduction et aux exemples de code de cet article, j'espère que les lecteurs pourront mieux comprendre le concept d'objets itérables et les appliquer au développement réel.

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 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

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD

Tags d'article chaud

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Remplacer les caractères de chaîne en javascript Remplacer les caractères de chaîne en javascript Mar 11, 2025 am 12:07 AM

Remplacer les caractères de chaîne en javascript

Tutoriel de configuration de l'API de recherche Google personnalisé Tutoriel de configuration de l'API de recherche Google personnalisé Mar 04, 2025 am 01:06 AM

Tutoriel de configuration de l'API de recherche Google personnalisé

Exemple Couleurs Fichier JSON Exemple Couleurs Fichier JSON Mar 03, 2025 am 12:35 AM

Exemple Couleurs Fichier JSON

Créez vos propres applications Web Ajax Créez vos propres applications Web Ajax Mar 09, 2025 am 12:11 AM

Créez vos propres applications Web Ajax

8 Superbes plugins de mise en page JQuery Page 8 Superbes plugins de mise en page JQuery Page Mar 06, 2025 am 12:48 AM

8 Superbes plugins de mise en page JQuery Page

Qu'est-ce que & # x27; ceci & # x27; en javascript? Qu'est-ce que & # x27; ceci & # x27; en javascript? Mar 04, 2025 am 01:15 AM

Qu'est-ce que & # x27; ceci & # x27; en javascript?

Améliorez vos connaissances jQuery avec le spectateur source Améliorez vos connaissances jQuery avec le spectateur source Mar 05, 2025 am 12:54 AM

Améliorez vos connaissances jQuery avec le spectateur source

10 feuilles de triche mobiles pour le développement mobile 10 feuilles de triche mobiles pour le développement mobile Mar 05, 2025 am 12:43 AM

10 feuilles de triche mobiles pour le développement mobile

See all articles