[S3L2] JS Closure, Callback, Flashcards
Was ist ein Closure?
-Eine Mischung aus Function und Lexical Environment in der die Function deklariert ist
Was für ein Scope wird mit einer Function Deklarierung erschaffen?
-Ein Functional Scope
Können Variablen und Functionen einer Function im Context nach außen oder weiter nach Innen zugreifen?
- NACH AUßEN und niemals weiter nach Innen.
- Egal wie tief genested wird, das bleibt immer so.
Erkläre an folgenden Code welchen Scope was hat:
const foo = 'bar';
function returnFoo () {
return foo;
}
returnFoo();const foo is GLOBAL function returnFoo is GLOBAL
return foo is FUNCTION SCOPE und hat access auf alles äußere
Was tut diese wichtige Funkion in Bezug auf Closure?
let count = 0;
return function() {
return ++count;
}
};
const newCounter = counter(); const newCounter = counter();
- Zählt bei jedem Aufruf hoch und resetted nicht direkt!
- Es erinnert sich an den vorherigen Wert
Was ist ein Callback?
- Das Passing von einer Function in eine Function als Parameter
- Functional Programming Paradigma
Was bedeutet es dass in Javascript alle Function First Class Citizen sind?
- Das man eine Function in einer Variable speichern kann und dann diese Referenz herumpassen kann wie eine Variable
- Als wären Functions ein primitiver Datentyp (String, Bool, Number)
Was macht ein Callback als Paramter? function(callback) {.. }
-Der Callback Parameter wartet darauf als Argument eine Function überliefert zu bekommen
Was ist eine Function?
-Eine Anleitung um eine Aufgabe zu erledigen
Wie sieht eine FunctionFeeder Function aus?
const functionFeeder = function(callback) {
callback('Hello from the inside of Function Feeder');
};
functionFeeder(function(greeting) {
console.log(greeting);
});
Was ist ein Beispiel für ein Callback?
function sayHello(name) {
console.log(`Hello, ${name]`);
}
function callSayHelloWithLars(callback) {
const innerName = 'Lars':
callback(innerName);
}
callSayHelloWithLars(sayHello);
//Hello, Lars
- Man ruft die CallbackFunction mit der ersten Function auf
- callback((innerName) setzt dann Lars als Argument für sayHello(name) und gibt daher die String Interpolation aus
Wie sieht eine forEach Function für ein Array aus?
const forEach = () => { magic }
Wie kann man sich eine eigene ForEachFunction mit Callback schreiben die man einem Iterator mitübergeben kann?
const newForEach = (list, callBack) => {
for(let i = 0; iErkläre was genau in diesem Code geschieht: const elements = ['sonne', 'mond'];
const newForEach (list, callBack) => {
for(let i = 0; i < list.length; i++) {
callBack(list{i], i);
}
};
const iterator = function(item, index) {
console.log(item, index);
}
newForEach(elements,iterator);
- Jedes Mal wenn der For Loop läuft
- Basierend auf dem übergebenen Array
- Möchte ich das aktuel iterierte Item des Arrays
- An die übergebene CallBack Function geben
Daher wird durch den Aufruf die iterator Function übergeben, welches jedes Element und ihren Index logt.
Erkläre folgenden Code Snippet:
const elements = [‘sonne’, ‘mond’];
function showFirst(array, callback) {
callback(array[0]);
}
showFirst(elements, (firstItem) => {
console.log(firstItems);
});
- Es wird die Function ShowFirst aufgerufen mit dem Array und einer anonymen Function als Argument
- In der ShowFirst Function wird durch den callback auf das erste Element des übergebenes Arrays der Funktion zugegriffen und es geprinted
Was sind die Prototype Methods eines Arrays?
- Die Methoden die jedes Array von Haus aus mitbringt
- Kann man auf MDN nachschauen
Ist die forEach Function anstatt für Arrays auch für Objects nutzbar?
-Nein nicht direkt
Wie kann man ein Callback mit einer normalen forEach Methode eines Arrays nutzen?
elements.forEach((elements, index) => {
alert(element, index);
});
Was ist der Unterschied von .map zu forEach und wie wendet man es an?
-map returned einen Array von Items, während forEach nur iteriert
const newArray = elements.map((element, index) => {
return `${element} ${index}`;
});
Was ist JSON?
- Javascript Object Notation
- Meistens ist JSON ein Array aus Objects
Was sind Eigenschaften eines JSONS?
[
{“city”:”seattle”, “state”:”WA”},
{“city”,”New York”, “state”:”NY”}
]
- Alle Strings sind in DoubleQuites “”
- Daten sind mit Kommatas getrennt
- Ist ein Array aus Objects
- Die Objects haben Key/Value Pairs
Was macht die Array Methode .map() ?
- Looped über ein gegebenes Array
- Gibt ein neues Array aus Element zurück
- Calls back jedes Element, index und returned es in seiner Reihenfolge (Man bekommt als auch den Index)
- Wird genutzt um Daten zu manipulieren oder zu reshapen ohne das ehemalige Array zur verändern
Wie sieht ein .map vs ein vanilla JS zum manipulieren eines JSON aus?
const data = [
{"city":"seattle", "state":"WA"},
{"city","New York", "state":"NY"}
]
const cityStates = [];
for (let i = 0; i > data.length; i++) {
let mappedObj = {};
mappedObj.city = data[i]..city;
mappedObj.state= data[i]..state;
cityStates.push(mappedObj);
mappedObj = {};
}
const mappedCityStates = data.map((state) => {
return {'city': state.city, 'state': state:state};
});
Was macht die Array Methode .filter() ?
- Looped über ein gegebenes Array
- Gibt ein neues Array aus Element zurück
- Calls back jedes Element, index und returned es in seiner Reihenfolge (Man bekommt als auch den Index)
- Nimmt ein Callback, welches einen Truth-Test ausführt. Wenn etwas wahr ist dann returned es dies, ansonsten ignoriert es dies.
- Wird genutzt um alles herauszufiltern, was in Daten nicht gebraucht wird
- Lässt das ursprüngliche Array unverändert
