From 05f91c7c1f892b0de1c5887866563567ce6fa128 Mon Sep 17 00:00:00 2001 From: Erik Behrends Date: Tue, 28 Nov 2023 19:26:15 +0100 Subject: [PATCH 1/2] Map and Set --- .../07-map-set/01-array-unique-map/task.md | 18 +- .../07-map-set/02-filter-anagrams/solution.md | 24 +- .../07-map-set/02-filter-anagrams/task.md | 16 +- .../07-map-set/03-iterable-keys/solution.md | 5 +- .../07-map-set/03-iterable-keys/task.md | 11 +- 1-js/05-data-types/07-map-set/article.md | 243 +++++++++--------- 6 files changed, 156 insertions(+), 161 deletions(-) diff --git a/1-js/05-data-types/07-map-set/01-array-unique-map/task.md b/1-js/05-data-types/07-map-set/01-array-unique-map/task.md index d68030032..3d92062e4 100644 --- a/1-js/05-data-types/07-map-set/01-array-unique-map/task.md +++ b/1-js/05-data-types/07-map-set/01-array-unique-map/task.md @@ -1,18 +1,14 @@ -importance: 5 +# Filtere eindeutige Array-Elemente ---- +Lass `arr` ein Array sein. -# Filter unique array members +Erstelle eine Funktion `unique(arr)`, die ein Array mit den eindeutigen Elementen von `arr` zurückgeben sollte. -Let `arr` be an array. - -Create a function `unique(arr)` that should return an array with unique items of `arr`. - -For instance: +Zum Beispiel: ```js function unique(arr) { - /* your code */ + /* Dein Code */ } let values = ["Hare", "Krishna", "Hare", "Krishna", @@ -22,6 +18,6 @@ let values = ["Hare", "Krishna", "Hare", "Krishna", alert( unique(values) ); // Hare, Krishna, :-O ``` -P.S. Here strings are used, but can be values of any type. +P.S. Hier werden Zeichenketten verwendet, es können aber Werte jeglichen Typs sein. -P.P.S. Use `Set` to store unique values. +P.P.S. Verwende `Set`, um eindeutige Werte zu speichern. diff --git a/1-js/05-data-types/07-map-set/02-filter-anagrams/solution.md b/1-js/05-data-types/07-map-set/02-filter-anagrams/solution.md index 160675185..173e6e928 100644 --- a/1-js/05-data-types/07-map-set/02-filter-anagrams/solution.md +++ b/1-js/05-data-types/07-map-set/02-filter-anagrams/solution.md @@ -1,6 +1,6 @@ -To find all anagrams, let's split every word to letters and sort them. When letter-sorted, all anagrams are same. +Um alle Anagramme zu finden, lassen wir uns jede Zeichenkette in Buchstaben aufteilen und sortieren sie. Wenn sie buchstabensortiert sind, sind alle Anagramme gleich. -For instance: +Zum Beispiel: ``` nap, pan -> anp @@ -9,14 +9,14 @@ cheaters, hectares, teachers -> aceehrst ... ``` -We'll use the letter-sorted variants as map keys to store only one value per each key: +Wir verwenden die buchstabensortierten Varianten als Schlüssel in einer Map, um nur einen Wert pro Schlüssel zu speichern: ```js run function aclean(arr) { let map = new Map(); for (let word of arr) { - // split the word by letters, sort them and join back + // das Wort in Buchstaben aufteilen, sortieren und wieder zusammenfügen *!* let sorted = word.toLowerCase().split('').sort().join(''); // (*) */!* @@ -31,9 +31,9 @@ let arr = ["nap", "teachers", "cheaters", "PAN", "ear", "era", "hectares"]; alert( aclean(arr) ); ``` -Letter-sorting is done by the chain of calls in the line `(*)`. +Das Buchstabensortieren wird durch die Aufrufkette in der Zeile `(*)` durchgeführt. -For convenience let's split it into multiple lines: +Zur besseren Übersicht teilen wir es in mehrere Zeilen auf: ```js let sorted = word // PAN @@ -43,21 +43,21 @@ let sorted = word // PAN .join(''); // anp ``` -Two different words `'PAN'` and `'nap'` receive the same letter-sorted form `'anp'`. +Zwei unterschiedliche Wörter `'PAN'` und `'nap'` erhalten dieselbe buchstabensortierte Form `'anp'`. -The next line put the word into the map: +Die nächste Zeile fügt das Wort in die Map ein: ```js map.set(sorted, word); ``` -If we ever meet a word the same letter-sorted form again, then it would overwrite the previous value with the same key in the map. So we'll always have at maximum one word per letter-form. +Wenn wir erneut auf ein Wort mit derselben buchstabensortierten Form stoßen, wird der vorherige Wert mit demselben Schlüssel in der Map überschrieben. Daher haben wir immer maximal ein Wort pro Buchstabenform. -At the end `Array.from(map.values())` takes an iterable over map values (we don't need keys in the result) and returns an array of them. +Am Ende erzeugt `Array.from(map.values())` ein iterierbares über die Werte der Map (wir benötigen die Schlüssel im Ergebnis nicht) und gibt ein Array davon zurück. -Here we could also use a plain object instead of the `Map`, because keys are strings. +Hier könnten wir anstelle der `Map` auch ein einfaches Objekt verwenden, da die Schlüssel Zeichenketten sind. -That's how the solution can look: +So könnte die Lösung aussehen: ```js run demo function aclean(arr) { diff --git a/1-js/05-data-types/07-map-set/02-filter-anagrams/task.md b/1-js/05-data-types/07-map-set/02-filter-anagrams/task.md index 731fd2c25..0964cc6f0 100644 --- a/1-js/05-data-types/07-map-set/02-filter-anagrams/task.md +++ b/1-js/05-data-types/07-map-set/02-filter-anagrams/task.md @@ -1,12 +1,13 @@ +--- importance: 4 --- -# Filter anagrams +# Anagramme filtern -[Anagrams](https://en.wikipedia.org/wiki/Anagram) are words that have the same number of same letters, but in different order. +[Anagramme](https://de.wikipedia.org/wiki/Anagramm) sind Wörter, die die gleiche Anzahl von Buchstaben haben, aber in einer anderen Reihenfolge. -For instance: +Zum Beispiel: ``` nap - pan @@ -14,15 +15,14 @@ ear - are - era cheaters - hectares - teachers ``` -Write a function `aclean(arr)` that returns an array cleaned from anagrams. +Schreibe eine Funktion `aclean(arr)`, die ein Array zurückgibt, das von Anagrammen bereinigt ist. -For instance: +Zum Beispiel: ```js let arr = ["nap", "teachers", "cheaters", "PAN", "ear", "era", "hectares"]; -alert( aclean(arr) ); // "nap,teachers,ear" or "PAN,cheaters,era" +alert( aclean(arr) ); // "nap,teachers,ear" oder "PAN,cheaters,era" ``` -From every anagram group should remain only one word, no matter which one. - +Von jeder Anagrammgruppe sollte nur ein Wort übrig bleiben, egal welches. diff --git a/1-js/05-data-types/07-map-set/03-iterable-keys/solution.md b/1-js/05-data-types/07-map-set/03-iterable-keys/solution.md index 7310d1d36..d74ecc686 100644 --- a/1-js/05-data-types/07-map-set/03-iterable-keys/solution.md +++ b/1-js/05-data-types/07-map-set/03-iterable-keys/solution.md @@ -1,7 +1,6 @@ +Das liegt daran, dass `map.keys()` ein iterierbares Objekt zurückgibt, aber kein Array. -That's because `map.keys()` returns an iterable, but not an array. - -We can convert it into an array using `Array.from`: +Wir können es mit `Array.from` in ein Array umwandeln: ```js run diff --git a/1-js/05-data-types/07-map-set/03-iterable-keys/task.md b/1-js/05-data-types/07-map-set/03-iterable-keys/task.md index 81507647f..909158065 100644 --- a/1-js/05-data-types/07-map-set/03-iterable-keys/task.md +++ b/1-js/05-data-types/07-map-set/03-iterable-keys/task.md @@ -2,11 +2,11 @@ importance: 5 --- -# Iterable keys +# Iterierbare Schlüssel -We'd like to get an array of `map.keys()` in a variable and then apply array-specific methods to it, e.g. `.push`. +Wir möchten ein Array von `map.keys()` in einer Variablen haben und dann darauf array-spezifische Methoden anwenden, z.B. `.push`. -But that doesn't work: +Aber das funktioniert nicht: ```js run let map = new Map(); @@ -16,9 +16,10 @@ map.set("name", "John"); let keys = map.keys(); *!* -// Error: keys.push is not a function +// Fehler: keys.push ist keine Funktion keys.push("more"); */!* ``` -Why? How can we fix the code to make `keys.push` work? +Warum? Wie können wir den Code korrigieren, damit `keys.push` funktioniert? + diff --git a/1-js/05-data-types/07-map-set/article.md b/1-js/05-data-types/07-map-set/article.md index 37f5e48c2..3aa91ab04 100644 --- a/1-js/05-data-types/07-map-set/article.md +++ b/1-js/05-data-types/07-map-set/article.md @@ -1,97 +1,96 @@ +# Map und Set -# Map and Set +Bisher haben wir folgende komplexe Datenstrukturen kennengelernt: -Till now, we've learned about the following complex data structures: +- Objekte werden für die Speicherung von Sammlungen mit Schlüsseln verwendet. +- Arrays werden für die Speicherung von geordneten Sammlungen verwendet. -- Objects are used for storing keyed collections. -- Arrays are used for storing ordered collections. - -But that's not enough for real life. That's why `Map` and `Set` also exist. +Aber das reicht für das echte Leben nicht aus. Deshalb gibt es auch `Map` und `Set`. ## Map -[Map](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map) is a collection of keyed data items, just like an `Object`. But the main difference is that `Map` allows keys of any type. +[`Map`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map) ist eine Sammlung von Daten-Elementen mit Schlüsseln, ähnlich wie ein `Object`. Der Hauptunterschied ist jedoch, dass `Map` Schlüssel jeglichen Typs zulässt. -Methods and properties are: +Methoden und Eigenschaften sind: -- [`new Map()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/Map) -- creates the map. -- [`map.set(key, value)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/set) -- stores the value by the key. -- [`map.get(key)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/get) -- returns the value by the key, `undefined` if `key` doesn't exist in map. -- [`map.has(key)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/has) -- returns `true` if the `key` exists, `false` otherwise. -- [`map.delete(key)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/delete) -- removes the element (the key/value pair) by the key. -- [`map.clear()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/clear) -- removes everything from the map. -- [`map.size`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/size) -- returns the current element count. +- [`new Map()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/Map) -- erstellt die Map. +- [`map.set(key, value)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/set) -- speichert den Wert unter dem Schlüssel. +- [`map.get(key)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/get) -- gibt den Wert zum Schlüssel zurück, `undefined` wenn der `key` nicht in der Map existiert. +- [`map.has(key)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/has) -- gibt `true` zurück, wenn der `key` existiert, andernfalls `false`. +- [`map.delete(key)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/delete) -- entfernt das Element (das Schlüssel/Wert-Paar) anhand des Schlüssels. +- [`map.clear()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/clear) -- entfernt alles aus der Map. +- [`map.size`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/size) -- gibt die aktuelle Anzahl der Elemente zurück. -For instance: +Zum Beispiel: ```js run let map = new Map(); -map.set('1', 'str1'); // a string key -map.set(1, 'num1'); // a numeric key -map.set(true, 'bool1'); // a boolean key +map.set('1', 'str1'); // ein String als Schlüssel +map.set(1, 'num1'); // eine Zahl als Schlüssel +map.set(true, 'bool1'); // ein Boolean als Schlüssel -// remember the regular Object? it would convert keys to string -// Map keeps the type, so these two are different: +// erinnerst Du Dich an das reguläre Objekt? Es würde Schlüssel zu Strings konvertieren +// Map behält den Typ, daher sind diese beiden unterschiedlich: alert( map.get(1) ); // 'num1' alert( map.get('1') ); // 'str1' alert( map.size ); // 3 ``` -As we can see, unlike objects, keys are not converted to strings. Any type of key is possible. +Wie wir sehen können, werden im Gegensatz zu Objekten die Schlüssel nicht in Strings umgewandelt. Jeder Schlüsseltyp ist möglich. -```smart header="`map[key]` isn't the right way to use a `Map`" -Although `map[key]` also works, e.g. we can set `map[key] = 2`, this is treating `map` as a plain JavaScript object, so it implies all corresponding limitations (only string/symbol keys and so on). +```smart header="`map[key]` ist nicht die korrekte Art eine `Map` zu verwenden" +Obwohl `map[key]` auch funktioniert, z.B. wir können `map[key] = 2` setzen, wird `map` dabei wie ein normales JavaScript-Objekt behandelt, daher gelten alle entsprechenden Einschränkungen (nur Strings/Symbol-Schlüssel und so weiter). -So we should use `map` methods: `set`, `get` and so on. +Deshalb sollten wir die `map`-Methoden verwenden: `set`, `get` usw. ``` -**Map can also use objects as keys.** +**Map kann auch Objekte als Schlüssel verwenden.** -For instance: +Zum Beispiel: ```js run let john = { name: "John" }; -// for every user, let's store their visits count +// für jeden Benutzer wollen wir die Anzahl der Besuche speichern let visitsCountMap = new Map(); -// john is the key for the map +// john ist der Schlüssel für die Map visitsCountMap.set(john, 123); alert( visitsCountMap.get(john) ); // 123 ``` -Using objects as keys is one of the most notable and important `Map` features. The same does not count for `Object`. String as a key in `Object` is fine, but we can't use another `Object` as a key in `Object`. +Objekte als Schlüssel zu verwenden ist eines der bemerkenswertesten und wichtigsten Merkmale von `Map`. Das Gleiche gilt nicht für `Object`. Strings als Schlüssel in `Object` ist in Ordnung, aber wir können kein anderes `Object` als Schlüssel in einem `Object` verwenden. -Let's try: +Lass es uns versuchen: ```js run let john = { name: "John" }; let ben = { name: "Ben" }; -let visitsCountObj = {}; // try to use an object +let visitsCountObj = {}; // versuche ein Objekt zu verwenden -visitsCountObj[ben] = 234; // try to use ben object as the key -visitsCountObj[john] = 123; // try to use john object as the key, ben object will get replaced +visitsCountObj[ben] = 234; // versuche Objekt ben als Schlüssel zu verwenden +visitsCountObj[john] = 123; // versuche Objekt john als Schlüssel zu verwenden, Objekt ben wird ersetzt *!* -// That's what got written! +// Das wurde geschrieben! alert( visitsCountObj["[object Object]"] ); // 123 */!* ``` -As `visitsCountObj` is an object, it converts all `Object` keys, such as `john` and `ben` above, to same string `"[object Object]"`. Definitely not what we want. +Da `visitsCountObj` ein Objekt ist, konvertiert es alle `Object`-Schlüssel, wie `john` und `ben` oben, zum gleichen String `"[object Object]"`. Definitiv nicht was wir wollen. -```smart header="How `Map` compares keys" -To test keys for equivalence, `Map` uses the algorithm [SameValueZero](https://tc39.github.io/ecma262/#sec-samevaluezero). It is roughly the same as strict equality `===`, but the difference is that `NaN` is considered equal to `NaN`. So `NaN` can be used as the key as well. +```smart header="Wie `Map` Schlüssel vergleicht" +Um Schlüssel auf Gleichheit zu testen, verwendet `Map` den Algorithmus [SameValueZero](https://tc39.github.io/ecma262/#sec-samevaluezero). Das ist ungefähr das Gleiche wie die strikte Gleichheit `===`, aber der Unterschied liegt darin, dass `NaN` als gleich zu `NaN` angesehen wird. So kann `NaN` auch als Schlüssel verwendet werden. -This algorithm can't be changed or customized. +Dieser Algorithmus kann nicht verändert oder angepasst werden. ``` -````smart header="Chaining" -Every `map.set` call returns the map itself, so we can "chain" the calls: +````smart header="Verkettung" +Jeder Aufruf von `map.set` gibt die Map selbst zurück, sodass wir die Aufrufe "verketten" können: ```js map.set('1', 'str1') @@ -100,15 +99,15 @@ map.set('1', 'str1') ``` ```` -## Iteration over Map +## Iteration über Map -For looping over a `map`, there are 3 methods: +Um über eine `map` zu iterieren, gibt es 3 Methoden: -- [`map.keys()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/keys) -- returns an iterable for keys, -- [`map.values()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/values) -- returns an iterable for values, -- [`map.entries()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/entries) -- returns an iterable for entries `[key, value]`, it's used by default in `for..of`. +- [`map.keys()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/keys) -- gibt ein iterierbares Objekt für Schlüssel zurück, +- [`map.values()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/values) -- gibt ein iterierbares Objekt für Werte zurück, +- [`map.entries()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/entries) -- gibt ein iterierbares Objekt für Einträge `[key, value]` zurück, wird standardmäßig in `for..of` genutzt. -For instance: +Zum Beispiel: ```js run let recipeMap = new Map([ @@ -117,41 +116,41 @@ let recipeMap = new Map([ ['onion', 50] ]); -// iterate over keys (vegetables) +// iteriere über Schlüssel (Gemüse) for (let vegetable of recipeMap.keys()) { alert(vegetable); // cucumber, tomatoes, onion } -// iterate over values (amounts) +// iteriere über Werte (Mengen) for (let amount of recipeMap.values()) { alert(amount); // 500, 350, 50 } -// iterate over [key, value] entries -for (let entry of recipeMap) { // the same as of recipeMap.entries() - alert(entry); // cucumber,500 (and so on) +// iteriere über [key, value] Einträge +for (let entry of recipeMap) { // das gleiche wie bei recipeMap.entries() + alert(entry); // cucumber,500 (usw.) } ``` -```smart header="The insertion order is used" -The iteration goes in the same order as the values were inserted. `Map` preserves this order, unlike a regular `Object`. +```smart header="Die Einfügereihenfolge wird verwendet" +Die Iteration erfolgt in der gleichen Reihenfolge, in der die Werte eingefügt wurden. `Map` bewahrt diese Reihenfolge, anders als ein normales `Object`. ``` -Besides that, `Map` has a built-in `forEach` method, similar to `Array`: +Darüber hinaus verfügt `Map` über eine eingebaute `forEach`-Methode, ähnlich wie `Array`: ```js -// runs the function for each (key, value) pair +// führt die Funktion für jedes (key, value) Paar aus recipeMap.forEach( (value, key, map) => { - alert(`${key}: ${value}`); // cucumber: 500 etc + alert(`${key}: ${value}`); // cucumber: 500 usw }); ``` -## Object.entries: Map from Object +## Object.entries: Map aus Object -When a `Map` is created, we can pass an array (or another iterable) with key/value pairs for initialization, like this: +Wenn eine `Map` erstellt wird, können wir ein Array (oder ein anderes iterierbares Objekt) mit Schlüssel/Wert-Paaren zur Initialisierung übergeben, so wie hier: ```js run -// array of [key, value] pairs +// Array von [key, value] Paaren let map = new Map([ ['1', 'str1'], [1, 'num1'], @@ -161,9 +160,9 @@ let map = new Map([ alert( map.get('1') ); // str1 ``` -If we have a plain object, and we'd like to create a `Map` from it, then we can use built-in method [Object.entries(obj)](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries) that returns an array of key/value pairs for an object exactly in that format. +Wenn wir ein einfaches Objekt haben und wir daraus eine `Map` erstellen wollen, dann können wir die eingebaute Methode [Object.entries(obj)](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/entries) verwenden, die ein Array von Schlüssel/Wert-Paaren für ein Objekt genau in diesem Format zurückgibt. -So we can create a map from an object like this: +So können wir also eine Map aus einem Objekt erstellen: ```js run let obj = { @@ -178,14 +177,14 @@ let map = new Map(Object.entries(obj)); alert( map.get('name') ); // John ``` -Here, `Object.entries` returns the array of key/value pairs: `[ ["name","John"], ["age", 30] ]`. That's what `Map` needs. +Hier gibt `Object.entries` das Array von Schlüssel/Wert-Paaren zurück: `[ ["name","John"], ["age", 30] ]`. Genau das braucht `Map`. -## Object.fromEntries: Object from Map +## Object.fromEntries: Object aus Map -We've just seen how to create `Map` from a plain object with `Object.entries(obj)`. +Wir haben gerade gesehen, wie man `Map` aus einem einfachen Objekt mit `Object.entries(obj)` erstellt. -There's `Object.fromEntries` method that does the reverse: given an array of `[key, value]` pairs, it creates an object from them: +Es gibt die Methode `Object.fromEntries`, die das Gegenteil macht: Gegeben ein Array von `[key, value]` Paaren erstellt sie daraus ein Objekt: ```js run let prices = Object.fromEntries([ @@ -194,16 +193,16 @@ let prices = Object.fromEntries([ ['meat', 4] ]); -// now prices = { banana: 1, orange: 2, meat: 4 } +// jetzt ist prices = { banana: 1, orange: 2, meat: 4 } alert(prices.orange); // 2 ``` -We can use `Object.fromEntries` to get a plain object from `Map`. +Wir können `Object.fromEntries` verwenden, um ein einfaches Objekt aus `Map` zu erstellen. -E.g. we store the data in a `Map`, but we need to pass it to a 3rd-party code that expects a plain object. +Z.B. wir speichern die Daten in einer `Map`, aber wir müssen sie an einen Drittanbieter-Code übergeben, der ein normales Objekt erwartet. -Here we go: +So wird dies erreicht: ```js run let map = new Map(); @@ -212,42 +211,42 @@ map.set('orange', 2); map.set('meat', 4); *!* -let obj = Object.fromEntries(map.entries()); // make a plain object (*) +let obj = Object.fromEntries(map.entries()); // erstelle ein einfaches Objekt (*) */!* -// done! +// fertig! // obj = { banana: 1, orange: 2, meat: 4 } alert(obj.orange); // 2 ``` -A call to `map.entries()` returns an iterable of key/value pairs, exactly in the right format for `Object.fromEntries`. +Ein Aufruf von `map.entries()` gibt ein iterierbares Objekt von Schlüssel/Wert-Paaren zurück, genau im richtigen Format für `Object.fromEntries`. -We could also make line `(*)` shorter: +Wir könnten auch die Zeile `(*)` kürzer machen: ```js -let obj = Object.fromEntries(map); // omit .entries() +let obj = Object.fromEntries(map); // weglassen von .entries() ``` -That's the same, because `Object.fromEntries` expects an iterable object as the argument. Not necessarily an array. And the standard iteration for `map` returns same key/value pairs as `map.entries()`. So we get a plain object with same key/values as the `map`. +Das kommt auf das Gleiche heraus, weil `Object.fromEntries` ein iterierbares Objekt als Argument erwartet (nicht unbedingt ein Array). Und die Standarditeration für `map` gibt die gleichen Schlüssel/Wert-Paare zurück wie `map.entries()`. So erhalten wir ein normales Objekt mit den gleichen Schlüsseln/Werten wie die `map`. ## Set -A [`Set`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set) is a special type collection - "set of values" (without keys), where each value may occur only once. +Ein [`Set`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set) ist eine spezielle Art Sammlung - "Set von Werten" (ohne Schlüssel), in dem jeder Wert nur einmal vorkommen darf. -Its main methods are: +Seine Hauptmethoden sind: -- [`new Set([iterable])`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/Set) -- creates the set, and if an `iterable` object is provided (usually an array), copies values from it into the set. -- [`set.add(value)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/add) -- adds a value, returns the set itself. -- [`set.delete(value)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/delete) -- removes the value, returns `true` if `value` existed at the moment of the call, otherwise `false`. -- [`set.has(value)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/has) -- returns `true` if the value exists in the set, otherwise `false`. -- [`set.clear()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/clear) -- removes everything from the set. -- [`set.size`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/size) -- is the elements count. +- [`new Set([iterable])`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/Set) -- erstellt das Set, und wenn ein `iterable`-Objekt übergeben wird (in der Regel ein Array), kopiert es die Werte daraus in das Set. +- [`set.add(value)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/add) -- fügt einen Wert hinzu, gibt das Set selbst zurück. +- [`set.delete(value)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/delete) -- entfernt den Wert, gibt `true` zurück wenn der `value` zum Zeitpunkt des Aufrufs existierte, sonst `false`. +- [`set.has(value)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/has) -- gibt `true` zurück, wenn der Wert im Set existiert, sonst `false`. +- [`set.clear()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/clear) -- entfernt alles aus dem Set. +- [`set.size`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/size) -- ist die Anzahl der Elemente. -The main feature is that repeated calls of `set.add(value)` with the same value don't do anything. That's the reason why each value appears in a `Set` only once. +Das Hauptmerkmal ist, dass wiederholte Aufrufe von `set.add(value)` mit demselben Wert nichts bewirken. Deshalb erscheint jeder Wert in einem `Set` nur einmal. -For example, we have visitors coming, and we'd like to remember everyone. But repeated visits should not lead to duplicates. A visitor must be "counted" only once. +Zum Beispiel haben wir Besucher, die kommen, und wir möchten uns an jeden erinnern. Aber wiederholte Besuche sollten nicht zu Duplikaten führen. Ein Besucher muss nur einmal "gezählt" werden. -`Set` is just the right thing for that: +`Set` ist genau das Richtige dafür: ```js run let set = new Set(); @@ -256,76 +255,76 @@ let john = { name: "John" }; let pete = { name: "Pete" }; let mary = { name: "Mary" }; -// visits, some users come multiple times +// Besuche, einige Benutzer kommen mehrere Male set.add(john); set.add(pete); set.add(mary); set.add(john); set.add(mary); -// set keeps only unique values +// das Set behält nur einzigartige Werte alert( set.size ); // 3 for (let user of set) { - alert(user.name); // John (then Pete and Mary) + alert(user.name); // John (dann Pete und Mary) } ``` -The alternative to `Set` could be an array of users, and the code to check for duplicates on every insertion using [arr.find](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find). But the performance would be much worse, because this method walks through the whole array checking every element. `Set` is much better optimized internally for uniqueness checks. +Die Alternative zu `Set` könnte ein Array von Benutzern sein, und der Code zum Überprüfen auf Duplikate bei jeder Einfügung unter Verwendung von [arr.find](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find). Aber die Leistung wäre viel schlechter, weil diese Methode das gesamte Array durchläuft, um jeden Element zu überprüfen. `Set` ist intern viel besser für Einzigartigkeitsprüfungen optimiert. -## Iteration over Set +## Iteration über Set -We can loop over a set either with `for..of` or using `forEach`: +Wir können entweder mit `for..of` oder `forEach` über ein Set iterieren: ```js run let set = new Set(["oranges", "apples", "bananas"]); for (let value of set) alert(value); -// the same with forEach: +// das Gleiche mit forEach: set.forEach((value, valueAgain, set) => { alert(value); }); ``` -Note the funny thing. The callback function passed in `forEach` has 3 arguments: a `value`, then *the same value* `valueAgain`, and then the target object. Indeed, the same value appears in the arguments twice. +Beachte eine merkwürdige Sache. Die Callback-Funktion, die `forEach` übergeben wurde, hat drei Argumente: einen `value`, dann *den gleichen Wert* `valueAgain` und dann das Zielobjekt. Tatsächlich erscheint der gleiche Wert doppelt in den Argumenten. -That's for compatibility with `Map` where the callback passed `forEach` has three arguments. Looks a bit strange, for sure. But this may help to replace `Map` with `Set` in certain cases with ease, and vice versa. +Das ist der Kompatibilität mit `Map` geschuldet, wo die Callback-Funktion für `forEach` drei Argumente hat. Sieht sicher ein bisschen seltsam aus, aber dies kann helfen, `Map` mit `Set` in bestimmten Fällen problemlos zu ersetzen, und umgekehrt. -The same methods `Map` has for iterators are also supported: +Die gleichen Methoden, die `Map` für Iteratoren hat, werden auch unterstützt: -- [`set.keys()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/keys) -- returns an iterable object for values, -- [`set.values()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/values) -- same as `set.keys()`, for compatibility with `Map`, -- [`set.entries()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/entries) -- returns an iterable object for entries `[value, value]`, exists for compatibility with `Map`. +- [`set.keys()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/keys) -- gibt ein iterierbares Objekt für Werte zurück, +- [`set.values()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/values) -- das Gleiche wie `set.keys()`, für die Kompatibilität mit `Map`, +- [`set.entries()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/entries) -- gibt ein iterierbares Objekt für Einträge `[value, value]` zurück, existiert für die Kompatibilität mit `Map`. -## Summary +## Zusammenfassung -[`Map`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map) -- is a collection of keyed values. +[`Map`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map) -- ist eine Sammlung von wertigen Daten mit Schlüsseln. -Methods and properties: +Methoden und Eigenschaften: -- [`new Map([iterable])`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/Map) -- creates the map, with optional `iterable` (e.g. array) of `[key,value]` pairs for initialization. -- [`map.set(key, value)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/set) -- stores the value by the key, returns the map itself. -- [`map.get(key)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/get) -- returns the value by the key, `undefined` if `key` doesn't exist in map. -- [`map.has(key)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/has) -- returns `true` if the `key` exists, `false` otherwise. -- [`map.delete(key)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/delete) -- removes the element by the key, returns `true` if `key` existed at the moment of the call, otherwise `false`. -- [`map.clear()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/clear) -- removes everything from the map. -- [`map.size`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/size) -- returns the current element count. +- [`new Map([iterable])`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/Map) -- erstellt die Map, optional mit `iterable` (z.B. Array) von `[key,value]`-Paaren zur Initialisierung. +- [`map.set(key, value)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/set) -- speichert den Wert unter dem Schlüssel, gibt die Map selbst zurück. +- [`map.get(key)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/get) -- gibt den Wert zum Schlüssel zurück, `undefined` wenn der `key` nicht in der Map existiert. +- [`map.has(key)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/has) -- gibt `true` zurück, wenn der `key` existiert, sonst `false`. +- [`map.delete(key)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/delete) -- entfernt das Element anhand des Schlüssels, gibt `true` zurück, wenn der `key` zum Zeitpunkt des Aufrufs vorhanden war, sonst `false`. +- [`map.clear()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/clear) -- entfernt alles aus der Map. +- [`map.size`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/size) -- gibt die aktuelle Anzahl an Elementen zurück. -The differences from a regular `Object`: +Die Unterschiede zu einem regulären `Object`: -- Any keys, objects can be keys. -- Additional convenient methods, the `size` property. +- Beliebige Schlüssel, auch Objekte können Schlüssel sein. +- Zusätzliche praktische Methoden, die `size`-Eigenschaft. -[`Set`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set) -- is a collection of unique values. +[`Set`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set) -- ist eine Sammlung von einzigartigen Werten. -Methods and properties: +Methoden und Eigenschaften: -- [`new Set([iterable])`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/Set) -- creates the set, with optional `iterable` (e.g. array) of values for initialization. -- [`set.add(value)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/add) -- adds a value (does nothing if `value` exists), returns the set itself. -- [`set.delete(value)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/delete) -- removes the value, returns `true` if `value` existed at the moment of the call, otherwise `false`. -- [`set.has(value)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/has) -- returns `true` if the value exists in the set, otherwise `false`. -- [`set.clear()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/clear) -- removes everything from the set. -- [`set.size`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/size) -- is the elements count. +- [`new Set([iterable])`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/Set) -- erstellt das Set, optional mit `iterable` (z.B. Array) von Werten zur Initialisierung. +- [`set.add(value)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/add) -- fügt einen Wert hinzu (macht nichts, wenn `value` bereits vorhanden ist), gibt das Set selbst zurück. +- [`set.delete(value)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/delete) -- entfernt den Wert, gibt `true` zurück, wenn der Wert im Moment des Aufrufs vorhanden war, sonst `false`. +- [`set.has(value)`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/has) -- gibt `true` zurück, wenn der Wert im Set vorhanden ist, sonst `false`. +- [`set.clear()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/clear) -- entfernt alles aus dem Set. +- [`set.size`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set/size) -- ist die Anzahl der Elemente. -Iteration over `Map` and `Set` is always in the insertion order, so we can't say that these collections are unordered, but we can't reorder elements or directly get an element by its number. +Die Iteration über `Map` und `Set` erfolgt immer in der Reihenfolge des Einfügens, daher können wir nicht sagen, dass diese Sammlungen ungeordnet sind, aber wir können die Elemente nicht umsortieren oder direkt ein Element anhand seiner Nummer abrufen. From d225c600506b159db95643b49745e1551172ccc3 Mon Sep 17 00:00:00 2001 From: Erik Behrends Date: Tue, 28 Nov 2023 19:30:28 +0100 Subject: [PATCH 2/2] Fix front matter --- 1-js/05-data-types/07-map-set/01-array-unique-map/task.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/1-js/05-data-types/07-map-set/01-array-unique-map/task.md b/1-js/05-data-types/07-map-set/01-array-unique-map/task.md index 3d92062e4..a33eb9873 100644 --- a/1-js/05-data-types/07-map-set/01-array-unique-map/task.md +++ b/1-js/05-data-types/07-map-set/01-array-unique-map/task.md @@ -1,3 +1,7 @@ +importance: 5 + +--- + # Filtere eindeutige Array-Elemente Lass `arr` ein Array sein.