Meta tags:
description=Iterables sind ein grundlegendes Konzept in JavaScript. Dieser Leitfaden erklärt Iterables, Iteratoren und praktische Techniken für Sammlungen.;

Headings (most frequently used words):

iterables, und, javascript, iterable, in, beispiel, array, das, von, iteratoren, einführung, verarbeiten, zusammenfassung, übungen, was, sind, eines, iterator, protokoll, generatoren, die, einfache, methode, zum, erstellen, unendliche, lazy, sequenzen, verwendung, from, spread, syntax, mit, destructuring, rest, string, unicode, sicherheit, ein, benutzerdefiniertes, range,

Text of the page (most frequently used words):
und (76), #javascript (36), die (35), ein (30), das (28), array (24), iterator (23), let (21), sie (20), console (20), objekt (19), log (19), api (19), dom (19), for (18), ist (18), iterable (18), für (17), iterables (17), mit (17), von (17), lernen (15), methode (15), symbol (15), value (14), set (13), next (13), map (11), string (11), from (11), methoden (10), der (10), sind (10), oder (10), range (10), this (9), den (9), spread (9), einen (9), html (8), web (8), eine (8), objekte (8), iterierbar (8), einem (8), verwenden (8), function (8), auf (8), run (8), editable (8), über (7), done (7), tools (6), einführung (6), iteratoren (6), rest (6), destructuring (6), yield (6), dem (6), length (6), the (6), eines (6), generatoren (6), w3docs (5), code (5), generator (5), übungen (5), nicht (5), einer (5), werden (5), wie (5), strings (5), können (5), str (5), new (5), siehe (5), syntax (5), elemente (5), arrays (5), jedes (5), wird (5), async (5), events (5), formatter (5), color (5), alle (4), json (4), css (4), was (4), aufruf (4), wert (4), kann (4), eingebaute (4), hat (4), korrekt (4), zeichen (4), emoji (4), unicode (4), typ (4), statt (4), schleifen (4), muster (4), and (4), verwendung (4), true (4), beispiel (4), eigenschaften (4), shadow (4), fetch (4), encoder (3), editor (3), quizze (3), php (3), verarbeiten (3), page (3), beim (3), nächsten (3), wenn (3), iterieren (3), sodass (3), sequenzen (3), lazy (3), sich (3), werte (3), schlüssel (3), schreiben (3), dass (3), als (3), myset (3), element (3), des (3), ohne (3), naturals (3), gibt (3), zurück (3), current (3), return (3), dieser (3), protokoll (3), leitfaden (3), techniken (3), flag (3), document (3), data (3), browser (3), event (3), promise (3), funktionen (3), operatoren (3), italiano (2), português (2), español (2), français (2), русский (2), deutsch (2), english (2), sprache (2), uns (2), beautifier (2), diff (2), password (2), python (2), java (2), git (2), bücher (2), snippets (2), zusammenfassung (2), muss (2), sequenz (2), zurückgeben (2), schleife (2), namens (2), welche (2), folgenden (2), aussagen (2), sicher (2), niemals (2), unendliche (2), apis (2), daten (2), nur (2), hand (2), machen (2), liefert (2), aufteilen (2), weitere (2), mehr (2), unter (2), zuweisung (2), first (2), second (2), others (2), works (2), any (2), aus (2), beliebigen (2), position (2), vollständige (2), parameter (2), array1 (2), array2 (2), merged (2), unique (2), math (2), zum (2), kopieren (2), sobald (2), haben (2), myarray (2), while (2), squares (2), akzeptiert (2), auch (2), durchlauf (2), funktion (2), funktioniert (2), benutzerdefinierten (2), warnung (2), values (2), einfachen (2), einschließlich (2), kommunikation (2), delegation (2), erzeugt (2), automatisch (2), dasselbe (2), damit (2), einfache (2), durchlaufen (2), erfassen (2), last (2), false (2), num (2), vertrag (2), operator (2), diese (2), iteration (2), seine (2), iteriert (2), fruits (2), fruit (2), wir (2), grundlegendes (2), typen (2), praktische (2), sammlungen (2), workers (2), file (2), suche (2), quantoren (2), anker (2), flags (2), components (2), animationen (2), url (2), microtasks (2), formulare (2), benutzerdefinierte (2), ereignisse (2), styles (2), klassen (2), advanced (2), await (2), fehlerbehandlung (2), promises (2), chaining (2), error (2), erweitern (2), handling (2), class (2), prototypes (2), interaktive (2), property (2), object (2), arrow (2), variablen (2), functions (2), objects (2), hash (2), 2026, rechte, vorbehalten, entwickler, gemacht, datenschutzrichtlinie, kontakt, unternehmen, probier, üben, kostenlose, tutorials, beispiele, seit, 2014, previous, yes, helpful, prüfen, iterierbares, verwendet, akkumulatorfunktion, iterierbaren, objekten, gehören, übung, indizieren, modellieren, möglich, wären, sehr, große, einmal, lässt, ihr, nahtlos, vielen, eingebauten, mapfn, geordneter, iterierbarer, einfacher, kürzeste, fehlerunanfälligste, etwas, zurückgibt, dessen, wann, immer, nutzer, angezeigt, zählen, müssen, spreaden, ihn, verlassen, informationen, finden, kapitel, ud83d, ude00b, stays, whole, raw, units, split, entscheidend, durchläuft, bit, codeeinheiten, bedeutet, surrogatpaar, einige, schriften, intakt, bleiben, gegensatz, zur, indizierung, älteren, codepunkte, sicherheit, dazu, erfahren, entnimmt, nach, fasst, zusammen, bild, collect, positionen, including, arguments, max, expandiert, überall, dort, argumente, erwartet, zusammenführen, übergeben, elementen, funktionsargumente, tun, with, square, each, converting, erstellt, neues, ähnlichen, optionale, zweites, argument, aufbau, angewendet, praktischer, zweiter, entfällt, öffnet, gesamte, konstrukt, ihrem, genauso, bei, unendlichen, führt, endlosschleife, ziehen, stattdessen, begrenzte, anzahl, werten, heraus, break, sequence, never, ends, are, produced, demand, anfrage, berechnet, beschreiben, groß, sogar, unendlich, speicher, halten, hauptgrund, vor, methodennamen, macht, generatormethode, kaum, boilerplate, alles, bidirektionaler, manuelle, verwalten, zustands, ausführlich, deklariert, pausiert, übergibt, verbraucher, ausführung, fortgesetzt, erheblich, kürzer, generatorfunktion, erstellen, diesem, mal, neuen, mehrfach, methodenkurzschreibweise, stellt, verweist, pfeilfunktion, würde, lexikalisch, kaputt, undefined, klassischer, anwendungsfall, numerischen, bereich, jemals, aufzubauen, benutzerdefiniertes, diesen, einhält, selbst, geschrieben, eingebauter, eindeutiger, warum, protokollmethoden, solchen, jeder, abgeschlossen, dann, ignoriert, trägt, optionales, endergebnis, nächste, herzstück, präziser, verwechseln, produziert, einträge, objekts, geerbter, gedacht, index, zusätzliche, bevorzugen, daher, geordnete, aufzählbaren, eigenschaftsschlüssel, dieses, snippet, zeigt, früchten, gängiges, ruft, verbraucht, resultierenden, bis, familie, schleifenkonstrukte, apple, banana, cherry, schauen, detaillierte, erkundung, verweisen, unseren, umfassenden, info, kern, implementiert, sequenziellen, zugriff, ermöglicht, mehrere, darunter, wichtig, zwischen, zurückgegebenen, tatsächlich, ausführt, unterscheiden, integraler, bestandteil, verschiedener, operationen, datenmanipulation, bestimmtes, implementieren, dadurch, iterations, konstrukten, verarbeitet, behandelt, grundlegenden, konzepte, arbeit, konzept, erklärt, intl, vibration, notifications, audio, webrtc, geolocation, websockets, service, midi, storage, validation, fullscreen, history, screen, orientation, push, webgl, battery, animations, regexp, sticky, katastrophales, backtracking, lookahead, lookbehind, alternation, rückwärtsreferenzen, name, erfassungsgruppen, gierige, faule, sets, ranges, escaping, sonderzeichen, wortgrenze, mehrzeiliger, modus, anfang, ende, klasse, zeichenklassen, regex, regular, expressions, styling, slots, komposition, template, custom, elements, animation, indexeddb, localstorage, sessionstorage, cookies, cookie, storing, wiederaufnehmbarer, dateiupload, server, sent, xmlhttprequest, ursprungsübergreifende, anfragen, abbruch, download, fortschritt, formdata, network, requests, canvas, references, loop, macrotasks, selection, resizeobserver, intersectionobserver, mutation, observer, various, ressourcen, laden, onload, onerror, scripts, defer, domcontentloaded, load, beforeunload, unload, resource, loading, ereignis, submit, clipboard, change, input, cut, copy, paste, fokussierung, focus, blur, formulareigenschaften, forms, controls, scrolling, tastatur, keydown, keyup, drag, drop, mausbewegungen, mausereignisse, grundlagen, auslösen, standard, browseraktionen, bubbling, capturing, introduction, koordinaten, fenstergrößen, scrollen, dokument, verändern, attribute, knoteneigenschaften, tag, inhalt, getelement, queryselector, browserumgebung, spezifikationen, streams, filereader, blob, textdecoder, textencoder, arraybuffer, binäre, binary, files, fensterübergreifende, popups, window, frames, windows, polyfills, transpiler, bigint, currying, eval, proxy, reflect, miscellaneous, dynamische, imports, export, import, module, modules, generators, promisification, callbacks, fehler, try, catch, mixins, checking, instanceof, private, geschützte, statische, klassenvererbung, grundsyntax, classes, prototyp, __proto__, native, prototypale, vererbung, inheritance, widgets, performance, optimierung, debugging, barrierefreiheit, kompatibilität, manipulationsbibliotheken, fortgeschrittene, manipulationstechniken, traversieren, arbeiten, manipulieren, auswählen, knoten, getter, setter, deskriptoren, properties, configuration, closures, vertieft, binding, debounce, throttle, dekoratoren, weiterleitung, call, apply, settimeout, setinterval, nfe, globales, alte, var, scope, rekursion, stack, tojson, datum, uhrzeit, assignment, keys, entries, weakmap, weakset, zahlen, primitiven, types, optional, konstruktor, primitiv, konvertierung, garbage, collection, objektmethoden, basics, es6, funktionsausdrücke, switch, bedingte, nullish, coalescing, logische, vergleichsoperatoren, typkonvertierungen, datentypen, use, strict, kommentare, basic, anmelden, durchsuchen, formatters, reverse, sha256, md5, calculator, colors, hsl, hex, mixer, converter, picker, general, kurse,

Text of the page (random words):
ungen snippets tools general tools html editor password generator html encoder code diff json beautifier alle 13 color tools color picker color converter color mixer color hex colors hsl alle 10 string tools string length calculator md5 hash generator sha256 hash generator string reverse url encoder alle 19 code formatters javascript formatter css formatter html formatter json formatter php formatter w3docs durchsuchen k de english en deutsch de русский ru français fr español es português pt italiano it anmelden javascript lernen javascript basic einführung javascript verwenden js kommentare js mit dom js use strict js variablen js datentypen js typkonvertierungen js interaktive funktionen js operatoren js vergleichsoperatoren js logische operatoren js nullish coalescing js bedingte operatoren js switch js schleifen js funktionen js funktionsausdrücke js arrow functions js es6 objects the basics js objects js objekte kopieren js objektmethoden this js garbage collection js symbol typen js objekt zu primitiv konvertierung js konstruktor operator new js optional chaining data types js methoden von primitiven js zahlen js math js strings js arrays js array methoden js iterables js map und set js weakmap und weakset js object keys values entries js destructuring assignment js datum und uhrzeit js json methoden tojson advanced functions js rekursion und stack js rest parameter und spread syntax js variablen scope js das alte var js globales objekt js function objekt nfe js die new function syntax js settimeout und setinterval js dekoratoren und weiterleitung call apply js debounce throttle js function binding js arrow funktionen vertieft js closures object properties configuration js property flags und deskriptoren js property getter und setter javascript html dom dom einführung die dom knoten dom elemente auswählen den dom manipulieren arbeiten mit styles im dom event handling im dom dom traversieren dom manipulationstechniken formulare im dom verwenden fortgeschrittene dom techniken dom manipulationsbibliotheken dom browser kompatibilität dom barrierefreiheit debugging und tools performance optimierung interaktive elemente und widgets prototypes inheritance js prototypale vererbung js native prototypes js prototyp methoden objekte ohne __proto__ classes js class grundsyntax js klassenvererbung statische eigenschaften und methoden private und geschützte eigenschaften in js js eingebaute klassen erweitern js class checking instanceof js mixins error handling js fehlerbehandlung try catch js benutzerdefinierte fehler error erweitern promises async await js einführung callbacks js promise js promise chaining js fehlerbehandlung mit promises promise api promisification microtasks async await generators advanced iteration generatoren async iteratoren und generatoren modules module export und import dynamische imports miscellaneous proxy und reflect eval currying bigint js polyfills transpiler frames and windows popups und window methoden fensterübergreifende kommunikation binary data files arraybuffer binäre arrays textdecoder und textencoder blob file und filereader js streams api document browserumgebung spezifikationen suche getelement queryselector knoteneigenschaften typ tag und inhalt attribute und eigenschaften das dokument verändern styles und klassen fenstergrößen und scrollen koordinaten introduction to events javascript einführung in browser ereignisse bubbling und capturing event delegation standard browseraktionen benutzerdefinierte ereignisse auslösen ui events mausereignisse grundlagen mausbewegungen drag and drop tastatur keydown und keyup scrolling forms controls formulareigenschaften und methoden fokussierung focus blur events change input cut copy paste js clipboard api formulare ereignis und methode submit document and resource loading page domcontentloaded load beforeunload unload scripts async defer ressourcen laden onload und onerror various mutation observer js intersectionobserver js resizeobserver selection und range event loop microtasks und macrotasks javascript references canvas network requests fetch api formdata fetch download fortschritt fetch abbruch fetch ursprungsübergreifende anfragen url objekte xmlhttprequest js server sent events wiederaufnehmbarer dateiupload storing data in the browser cookies document cookie localstorage sessionstorage indexeddb animation css animationen javascript animationen web components web components custom elements shadow dom template element shadow dom slots komposition shadow dom styling shadow dom und events regular expressions js regex muster und flags zeichenklassen unicode flag u und klasse p anker string anfang und ende mehrzeiliger modus der anker flag m wortgrenze b escaping sonderzeichen sets und ranges quantoren und n gierige und faule quantoren erfassungsgruppen rückwärtsreferenzen im muster n und k name javascript alternation or lookahead und lookbehind katastrophales backtracking sticky flag y suche an position methoden von regexp und string javascript apis web animations api file api battery api webgl push api screen orientation api history api console api fullscreen api validation api web storage api web midi api js web workers service workers websockets geolocation webrtc web audio api notifications api die vibration api js intl api javascript iterables und iteratoren iterables sind ein grundlegendes konzept in javascript dieser leitfaden erklärt iterables iteratoren und praktische techniken für sammlungen einführung in javascript iterables javascript iterables sind objekte die ein bestimmtes protokoll implementieren und dadurch von iterations konstrukten wie for of verarbeitet werden können dieser leitfaden behandelt die grundlegenden konzepte eingebaute iterables und praktische techniken für die arbeit mit sammlungen was sind iterables in javascript im kern ist ein iterable ein objekt das die methode symbol iterator implementiert und damit sequenziellen zugriff auf seine elemente ermöglicht mehrere eingebaute typen in javascript sind iterierbar darunter array string map set und weitere es ist wichtig zwischen einem iterable dem objekt das durchlaufen wird und einem iterator dem von symbol iterator zurückgegebenen objekt das den durchlauf tatsächlich ausführt zu unterscheiden diese iterables sind integraler bestandteil verschiedener operationen wie schleifen und datenmanipulation i info für eine detaillierte erkundung der javascript map und set objekte verweisen wir auf unseren umfassenden leitfaden zu javascript map und set beispiel eines iterable array schauen wir uns ein grundlegendes beispiel eines iterable in javascript an javascript editable run let fruits apple banana cherry for let fruit of fruits console log fruit dieses code snippet zeigt das iterieren über ein array von früchten ein gängiges iterable die for of schleife ruft automatisch die symbol iterator methode des iterable auf und verbraucht den resultierenden iterator bis done den wert true hat siehe javascript schleifen für die vollständige familie der schleifenkonstrukte warnung verwechseln sie nicht for of mit for in for of iteriert über die werte die ein iterable produziert array elemente string zeichen map einträge for in iteriert über die aufzählbaren eigenschaftsschlüssel eines objekts einschließlich geerbter und ist für einfache objekte gedacht nicht für arrays die verwendung von for in auf einem array liefert index strings 0 1 und kann zusätzliche eigenschaften erfassen bevorzugen sie daher for of für geordnete daten das iterator protokoll das herzstück eines iterable ist seine symbol iterator methode das protokoll ist ein präziser vertrag ein iterable hat eine methode mit dem schlüssel symbol iterator der aufruf dieser methode gibt einen iterator zurück ein iterator ist ein objekt mit einer next methode jeder aufruf von next gibt ein objekt value done zurück done false value ist das nächste element in der sequenz done true die iteration ist abgeschlossen value wird dann ignoriert oder trägt ein optionales endergebnis jedes objekt das diesen vertrag einhält funktioniert mit for of dem spread operator destructuring und array from auch wenn sie das objekt selbst geschrieben haben symbol ist ein eingebauter eindeutiger schlüssel siehe symbol typ warum diese protokollmethoden einen solchen statt eines einfachen string namens verwenden beispiel ein benutzerdefiniertes range iterable ein klassischer anwendungsfall ist ein objekt das einen numerischen bereich lazy erzeugt ohne jemals ein array aufzubauen javascript editable run let range from 1 to 5 symbol iterator let current this from let last this to return next if current last return value current done false return value undefined done true for let num of range console log num 1 2 3 4 5 in diesem beispiel gibt die methode symbol iterator jedes mal einen neuen iterator zurück sodass dasselbe range objekt mehrfach durchlaufen werden kann die methodenkurzschreibweise stellt sicher dass this korrekt auf das range objekt verweist die verwendung einer pfeilfunktion für symbol iterator würde this lexikalisch erfassen und das muster kaputt machen generatoren die einfache methode zum erstellen von iterables das manuelle schreiben von next und das verwalten des zustands von hand ist ausführlich eine generatorfunktion deklariert mit function und unter verwendung von yield erzeugt automatisch einen iterator jedes yield pausiert die funktion und übergibt einen wert an den verbraucher die ausführung wird beim nächsten next aufruf fortgesetzt dasselbe range wird damit erheblich kürzer javascript editable run let range from 1 to 5 symbol iterator for let value this from value this to value yield value console log range 1 2 3 4 5 das vor dem methodennamen macht sie zu einer generatormethode sodass range mit kaum boilerplate iterierbar ist für alles was generatoren können einschließlich bidirektionaler kommunikation und delegation mit yield siehe generatoren und async iteratoren und generatoren unendliche und lazy sequenzen da ein iterator den nächsten wert nur auf anfrage berechnet kann er sequenzen beschreiben die zu groß oder sogar unendlich sind um sie im speicher zu halten das ist der hauptgrund einen benutzerdefinierten iterator statt eines einfachen array zu schreiben javascript editable run function naturals let n 1 while true yield n let it naturals console log it next value 1 console log it next value 2 console log it next value 3 the sequence never ends values are produced on demand warnung verwenden sie niemals spread naturals oder for of ohne break bei einem unendlichen iterable das führt zu einer endlosschleife ziehen sie stattdessen eine begrenzte anzahl von werten mit next heraus iterables verarbeiten sobald ein objekt iterierbar ist öffnet sich die gesamte sprache für es jedes konstrukt das ein iterable akzeptiert funktioniert mit ihrem benutzerdefinierten typ genauso wie mit arrays verwendung von array from die methode array from erstellt ein neues array aus einem beliebigen iterable oder array ähnlichen objekt sie akzeptiert auch eine optionale map funktion als zweites argument die auf jedes element beim aufbau des array angewendet wird praktischer als array from it map fn da ein zweiter durchlauf entfällt javascript editable run let myset new set 1 2 3 4 5 let myarray array from myset console log myarray 1 2 3 4 5 with the map function square each value while converting let squares array from myset x x x console log squares 1 4 9 16 25 siehe javascript map und set für mehr zu set und array methoden für das was sie tun können sobald sie ein array haben spread syntax mit iterables die spread syntax expandiert ein iterable überall dort wo argumente oder elemente erwartet werden zum zusammenführen von arrays kopieren oder übergeben von elementen als funktionsargumente javascript editable run let array1 1 2 3 let array2 4 5 6 let merged array1 array2 console log merged 1 2 3 4 5 6 spread works on any iterable including a set let unique new set 1 1 2 3 3 console log unique 1 2 3 and as function arguments console log math max 7 2 9 4 9 für das vollständige bild von in spread und collect positionen siehe rest parameter und spread syntax destructuring und rest destructuring zuweisung entnimmt werte aus einem beliebigen iterable nach position und das rest muster fasst den rest in einem array zusammen javascript editable run let first second others 10 20 30 40 console log first 10 console log second 20 console log others 30 40 works on any iterable e g a set let a b new set x y z console log a b x y mehr dazu erfahren sie unter destructuring zuweisung das string iterable und unicode sicherheit strings sind iterierbar und entscheidend ist dass der iterator unicode codepunkte durchläuft nicht 16 bit codeeinheiten das bedeutet dass surrogatpaar zeichen emoji einige schriften intakt bleiben im gegensatz zur indizierung mit i oder älteren for schleifen über length die sie aufteilen können javascript editable run let str a ud83d ude00b a b for let ch of str console log ch a b the emoji stays whole console log str a b length 3 console log str length 3 console log str length 4 raw code units split the emoji wann immer sie zeichen die dem nutzer angezeigt werden korrekt zählen oder aufteilen müssen iterieren sie den string oder spreaden sie ihn statt sich auf length zu verlassen weitere informationen finden sie im kapitel strings zusammenfassung ein objekt ist iterierbar wenn es eine symbol iterator methode hat die einen iterator zurückgibt ein objekt dessen next value done liefert verwenden sie einen generator function yield statt next von hand zu schreiben das ist die kürzeste und fehlerunanfälligste methode etwas iterierbar zu machen verwenden sie for of für die werte geordneter iterierbarer daten verwenden sie for in nur für die schlüssel einfacher objekte einmal iterierbar lässt sich ihr typ nahtlos mit spread destructuring rest array from it mapfn und vielen eingebauten apis verwenden iteratoren sind lazy sodass sie unendliche oder sehr große sequenzen modellieren können die in einem array niemals möglich wären strings iterieren nicht indizieren um unicode zeichen wie emoji sicher zu verarbeiten übungen übung welche der folgenden aussagen über javascript iterables sind korrekt welche der folgenden aussagen über javascript iterables sind korrekt ein objekt ist iterierbar wenn es eine methode namens symbol iterator hat zu iterierbaren objekten gehören eingebaute javascript objekte wie array string map und set die methode symbol iterator muss eine akkumulatorfunktion zurückgeben ein iterierbares objekt kann nicht in einer for of schleife verwendet werden die methode next muss beim aufruf den nächsten wert in der sequenz zurückgeben prüfen was this page helpful yes no previous js array methoden next js map und set on this page einführung in javascript iterables iterables verarbeiten zusammenfassung übungen w3docs kostenlose tutorials beispiele übungen snippets und quizze für das web seit 2014 bücher html lernen css lernen javascrip...