Quelle est la différence entre pour ... de et pour ... en boucles?
car ... en boucle est utilisé pour traverser les clés d'un objet, tandis que ... de est utilisé pour traverser les valeurs d'un objet itérable. 1. Car ... in est adapté aux objets ordinaires, traversant tous leurs noms de clés d'attribut énumérés, y compris les index de tableau (retournés en tant que chaînes); 2. Pour ... de est adapté aux objets itérables tels que les tableaux, les chaînes, la carte, le jeu, etc., et accéder directement aux valeurs des éléments; 3. Base de sélection: si vous devez traiter les noms de clés ou vérifier la structure des objets, utilisez pour ... in. Si vous faites attention à la valeur elle-même et que vous souhaitez que le code soit concis, utilisez pour ... de.
La principale différence entre for...of
et for...in
les boucles réside dans ce dont ils itéèrent. for...in
les boucles sont utilisées pour parcourir les propriétés énumérées d'un objet, telles que les clés (noms de propriétés) dans un objet ou un tableau. D'un autre côté, for...of
boucles sont habituées à itérer sur des objets itérables , comme les tableaux, les chaînes, les cartes, les ensembles, et plus encore - essentiellement tout ce qui implémente le protocole itérable.
for...in
boucles: itérer sur les clés de l'objet
Lorsque vous utilisez un for...in
boucle, il passe par toutes les propriétés touchées par des chaînes énumérées d'un objet. Cela le rend utile pour inspecter la structure d'un objet - pas nécessairement ses valeurs.
const obj = {a: 1, b: 2, c: 3}; pour (laissez la clé dans obj) { console.log (clé); // Sorties: a, b, c }
- Il fonctionne sur n'importe quel objet, y compris les tableaux.
- L'ordre d'itération n'est pas garanti pour être numérique, en particulier avec les objets sans réseau.
- Soyez prudent lorsque vous l'utilisez avec les tableaux - il itère sur les positions d'index comme des chaînes , pas les valeurs réelles.
Erreur courante:
const Arr = [10, 20, 30]; pour (laissez-je dans arr) { console.log (i); // Sorties "0", "1", "2" - pas des nombres, mais des chaînes! }
Utilisez cette boucle lorsque vous devez accéder aux noms de propriétés ou aux clés, en particulier dans les objets simples.
for...of
boucles: itérez directement les valeurs
Cette boucle est conçue spécifiquement pour les objets itérables - des choses comme les tableaux, les chaînes, les cartes, les ensembles, les nodelists, etc.
const Arr = [10, 20, 30]; pour (Soit la valeur de arr) { console.log (valeur); // Sorties: 10, 20, 30 }
- Il vous donne un accès direct aux éléments, pas à leurs index ou clés.
- Fonctionne très bien avec les structures de données qui implémentent le protocole itérable.
- Ne fonctionne pas directement sur des objets réguliers, sauf si vous les enveloppez ou définissez votre propre itérateur.
Exemple avec une chaîne:
pour (laissez char de "Hello") { console.log (char); // Bonjour }
Utilisez cette boucle lorsque vous souhaitez simplement traiter chaque élément d'une collection sans vous soucier des clés ou des index.
Quand utiliser lequel?
Voici un guide rapide pour vous aider à décider quelle boucle utiliser en fonction de vos besoins:
-
✅ Utilisation
for...in
quand:- Vous travaillez avec un objet simple et devez accéder aux clés ou aux noms de propriétés.
- Vous devez inspecter la structure d'un objet (comme le débogage ou l'accès à la propriété dynamique).
-
✅ Utilisation
for...of
quand:- Vous avez affaire à des tableaux, des chaînes, des cartes ou des ensembles comme iTÉRABLES.
- Vous vous souciez des valeurs elles-mêmes, pas de leurs clés ou index.
- Vous voulez un code propre et lisible qui se concentre sur les données, pas sur la mécanique.
Remarque également:
-
for...in
peut inclure des propriétés énumérables héréditaires si l'objet a une chaîne prototype. -
for...of
peut être éloigné de l'utilisationbreak
, tout comme une boucle normale.
Fondamentalement, choisissez en fonction de ce que vous bouclez et de ce dont vous avez besoin. L'un n'est pas meilleur que l'autre - ils sont juste méchants à des fins différentes.
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!

Outils d'IA chauds

Undress AI Tool
Images de déshabillage gratuites

Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.

Clothoff.io
Dissolvant de vêtements AI

Video Face Swap
Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Article chaud

Outils chauds

Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise
Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP

Dreamweaver CS6
Outils de développement Web visuel

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

La portée de JavaScript détermine la portée d'accessibilité des variables, qui sont divisées en étendue globale, fonction et au niveau du bloc; Le contexte détermine la direction de cela et dépend de la méthode d'appel de fonction. 1. Les étendues incluent la portée globale (accessible n'importe où), la portée de la fonction (valide uniquement dans la fonction) et la portée au niveau du bloc (LET et const sont valides dans {}). 2. Le contexte d'exécution contient l'objet variable, la chaîne de portée et les valeurs de cela. Cela pointe vers global ou non défini dans la fonction ordinaire, l'appel de méthode pointe vers l'objet d'appel, le constructeur pointe vers le nouvel objet, et peut également être explicitement spécifié par appel / application / liaison. 3. La fermeture fait référence aux fonctions accédant et en se souvenant des variables de portée externes. Ils sont souvent utilisés pour l'encapsulation et le cache, mais peuvent provoquer

CompositionAPI dans Vue3 convient plus à la logique complexe et à la dérivation de type, et OptionsAPI convient aux scénarios et débutants simples; 1. OptionsAPI organise le code en fonction d'options telles que les données et les méthodes, et a une structure claire mais les composants complexes sont fragmentés; 2. CompositionAPI utilise la configuration pour concentrer la logique liée, ce qui est propice à la maintenance et à la réutilisation; 3. CompositionAPI réalise la réutilisation logique sans conflit et paramétrisable par le biais de fonctions composables, ce qui est mieux que le mixin; 4. CompositionAPI a une meilleure prise en charge de la dérivation de type dactylographiée et de type plus précise; 5. Il n'y a pas de différence significative dans le volume de performances et d'emballage des deux; 6.

Il existe une différence essentielle entre les travailleurs Web de JavaScript et Javathreads dans un traitement simultané. 1. JavaScript adopte un modèle unique. WebWorkers est un fil indépendant fourni par le navigateur. Il convient pour effectuer des tâches longues qui ne bloquent pas l'interface utilisateur, mais ne peuvent pas utiliser le DOM; 2. Java prend en charge le multithreading réel à partir du niveau de la langue, créé via la classe de threads, adapté à un traitement simultanée complexe et côté serveur; 3. Les travailleurs Web utilisent PostMessage () pour communiquer avec le fil principal, qui est hautement sécurisé et isolé; Les threads Java peuvent partager la mémoire, de sorte que les problèmes de synchronisation doivent être prêts à prêter attention; 4. Les travailleurs Web sont plus adaptés à l'informatique parallèle frontale, comme le traitement d'image, et

Initialiser le projet et créer package.json; 2. Créez un script d'entrée index.js avec shebang; 3. Registre des commandes via des champs bin dans package.json; 4. Utilisez des Yargs et d'autres bibliothèques pour analyser les paramètres de ligne de commande; 5. Utilisez le test local NPMLink; 6. Ajouter l'aide, la version et les options pour améliorer l'expérience; 7. Publier éventuellement via NPMPublish; 8. Affectuer éventuellement l'achèvement automatique avec Yargs; Enfin, créez des outils CLI pratiques grâce à une structure raisonnable et à une conception de l'expérience utilisateur, effectuer des tâches d'automatisation ou distribuer des widgets et se terminer par des phrases complètes.

Utilisez Document.CreateElement () pour créer de nouveaux éléments; 2. Personnaliser les éléments via TextContent, ClassList, SetAttribute et d'autres méthodes; 3. Utilisez des méthodes APPEDCHILD () ou plus flexibles APPEND () pour ajouter des éléments au DOM; 4. Utiliser éventuellement INSERTBEFORE (), avant () et d'autres méthodes pour contrôler la position d'insertion; Le processus complet consiste à créer → Personnaliser → Ajouter, et vous pouvez mettre à jour dynamiquement le contenu de la page.

Les types de conditions avancées de TypeScript implémentent le jugement logique entre les types via TextendU? X: Y Syntaxe. Ses capacités de base se reflètent dans les types de conditions distribuées, l'inférence de type inférieure et la construction d'outils de type complexe. 1. Le type conditionnel est distribué dans les paramètres de type nu et peut automatiquement diviser le type de joint, tel que pour obtenir la chaîne [] | nombre []. 2. Utiliser la distribution pour construire des outils de filtrage et d'extraction: exclut exclut les types via TextendU? Never: T, extraire extrait les points communs via TextendU? T: jamais, et des filtres non nuls nuls / non définis. 3

MicrofronttendSSolvescalingCallegengeSInLargeTeamsByAnabled indépendante développement et élaboration de choOsanIntegrationsStrategy: UseModuleFederationInwebpack5ForruntimeLoadingAndTrue Independence, Build-Time IntegrationForsIpleSetups, Oriframes / webcomponents webcomponents

varisfunction-scoped,canbereassigned,hoistedwithundefined,andattachedtotheglobalwindowobject;2.letandconstareblock-scoped,withletallowingreassignmentandconstnotallowingit,thoughconstobjectscanhavemutableproperties;3.letandconstarehoistedbutnotinitial
