25. Dezember 2021
1. Funktionen
Arrow function
const language = ['dänisch', 'spanisch', 'französisch'];
const question = language.map(function (lang) {
return `Translate into ${lang}?`;
})
console.log(question);
Mit der map-Funktion wird eine Funktion für jedes Element des language-Arrays aufgerufen. Die anonyme Funktion soll dabei als Arrow function geschrieben werden.
1. Schritt: das Schlüsselwort function löschen und die Arrow function-Schreibweise (=>) vor die geschweifte Klammer schreiben
const language = ['dänisch', 'spanisch', 'französisch'];
const question = language.map((lang) => {
return `Translate into ${lang}?`;
})
console.log(question);
2. Schritt: Klammern um das language Argument entfernen
const language = ['dänisch', 'spanisch', 'französisch'];
const question = language.map(lang => {
return `Translate into ${lang}?`;
})
console.log(question);
3. Schritt: das Schlüsselwort return entfernen, sodass die gesamte Arrow function kompakt in eine Zeile passt
const language = ['dänisch', 'spanisch', 'französisch'];
const question = language.map(lang => `Translate into ${lang}?`);
console.log(question);
.map() Funktion
Beispiel 1:
Ein Array mit beliebigen Werten soll gemapt und die Werte mit 10 addiert werden
const values = [30, 50, 60, 80]
const result = values.map(value => value + 10);
console.log(result); // [40, 60, 70, 90]
Beispiel 2:
Neben dem oben gezeigten hier noch ein weiteres Beispiel mit der .map() Funktion:
const speaker = 'Tom Don';
const language = ['dänisch', 'spanisch', 'französisch'];
const list = language.map((lang, i) => ({Name: lang, Speaker: speaker, Count: i + 1}))
console.table(list);
Das language Array wird gemapt und als Objekt mit den Eigenschaftsnamen Name, Speaker, Count als Tabelle ausgegeben
Beispiel 3:
In einem weiteren Beispiel wird ein Array mit verschachtelten Objekten mit der Map-Funktion über Template Literals ausgegeben
const language = [
{
name: 'englisch',
speaker: 1268
},
{
name: 'mandarin',
speaker: 1117
},
{
name: 'spanisch',
speaker: 538
}
]
const ranking = `
<table>
${language.map(lg => `<tr><td>${lg.name} sprechen ${lg.speaker} mio. Menschen</td></tr>`)}
</table>`;
document.body.innerHTML = ranking;
.filter() Funktion
const values = [2, 7, 11, 19, 4, 14, 6];
const high = values.filter(value => value > 10);
console.log(high);
Mit der .filter() Funktion lassen sich zum Beispiel Wertebereiche ermitteln. Im oben gezeigten Beispiel werden die Werte aus dem values Array größer 10 ausgegeben
Immediately invoked function (IIFE)
Closures
Getter, Setter
2. Asynchrone Programmierung
3. Klassen
Prototypen
Konstruktoren