hinzugefügt das Folgende: apply Methode, call Methode, Verwendung der First Class Methoden, der Unterschied zwischen value und reference Werten durch Methoden, funktion, die eine Funktion zurück gibt

This commit is contained in:
David 2022-11-03 20:03:53 +01:00
parent b07eb647cf
commit 4db15ab3e2
5 changed files with 157 additions and 3 deletions

View File

@ -0,0 +1,57 @@
const lufthansa = {
airline: "Lufthansa",
iataCode: "LH",
bookings: [],
// neue Syntax (ES2020) einer Methode eines Objektes
book(flightNumber, passengerName) {
console.log(
`${passengerName} booked a seat on ${this.iataCode}${flightNumber}`
);
this.bookings.push({
flight: `${this.iataCode}${flightNumber}`,
passengerName,
});
},
};
lufthansa.book(573, "David Aster");
lufthansa.book(910, "Joanne Aster");
console.log(lufthansa.bookings);
const eurowings = {
airline: "Eurowings",
iataCode: "EW",
bookings: [],
};
// book Funktion gehört nicht mehr zum lufthansa Objekt, sondern ist eine selbständige/eigene Funktion
const book = lufthansa.book;
// eurowings.book = book;
// die Methode call ruft eigentlich book Methode mit zwei Argumenten (226, "David Aster") auf, und weise diese Methode zum Objekt eurowings zu
// (call Methode zeigt auf das eurowings Objekt)
// Ausgabe wird "David Aster booked a seat on EW226" sein
book.call(eurowings, 226, "David Aster");
// Ausgabe wird "Joanne Aster booked a seat on EW897" sein
book.call(eurowings, 897, "Joanne Aster");
// checken, ob die hinzugefügten Objekten im Feld bookings existieren
console.log(eurowings.bookings);
const swiss = {
airline: "Swiss Air Lines",
iataCode: "SW",
bookings: [],
};
// wiederverwendbare book Funktion in jedem Objekt
book.call(swiss, 998, "David Aster");
// apply Methode, bekommt statt eines einzelnen Wert als Parameter, ein Feld der Werte
let fligtData = [669, "David Aster"];
// apply Methode ist veraltete Methode und ist es nichts mehr oft benutzt
book.apply(swiss, fligtData);
console.log(swiss.bookings);
// stattdessen benutzt man eine Kombination der call methode und des spread Operatoren
fligtData = [109, "David Schmidt"];
book.call(swiss, ...fligtData);

View File

@ -0,0 +1,41 @@
const add = (a, b) => a + b;
const counter = {
value: 23,
inc: function () {
this.value + 1;
},
};
const greet = () => {
console.log("Hey David");
};
// const btnGreet = document.getElementById("greet");
// btnGreet.addEventListener("click", greet);
// eine Funktion, die eine Funktion zurück gibt
const count = function () {
let counter = 0;
return function () {
console.log("TEST");
};
};
count()();
const oneWord = function (str) {
return str.replace(/ /g, "").toLowerCase();
};
const upperFirstWord = function (str) {
const [firstWord, ...others] = str.split(" ");
return [firstWord.toUpperCase(), ...others].join(" ");
};
// Higher-order function
const transformer = function (str, fn) {
console.log(`Original string: ${str}`);
console.log(`Transformed string: ${fn(str)}`);
console.log(`Transformed by: ${fn.name}`);
};
transformer("JavaScript is the best", upperFirstWord);
transformer("JavaScript is the best", oneWord);

View File

@ -0,0 +1,16 @@
const greet = function (greeting) {
return function (name) {
console.log(`${greeting} ${name}`);
};
};
// greeterHey wird jetzt Methode werden, weil die Methode greet gibt eine Methode zurück
const greeterHey = greet("Hey");
// jetzt kann man Methode die unter Methode greet steht ausführen
greeterHey("David");
// es gibt die Möglichkeit die beiden Methoden auf einmal auszuführen
greet("Hej")("David");
// das Gleiche wie die obene Methode greet
const greetArrow = greeting => name => console.log(`${greeting} ${name}`);
greetArrow("Hej")("Joanne");

View File

@ -4,8 +4,10 @@
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>A closer look at functions</title>
<script src=""></script>
<title>Callbacks</title>
</head>
<body></body>
<body>
<button id="greet">Greet</button>
<script src="firstClassFunctions.js"></script>
</body>
</html>

View File

@ -0,0 +1,38 @@
const flight = "CA320";
const david = {
name: "David A.",
passport: 32165474532,
};
// das erste Parameter ist in unserem Fall primitive Typ der Datei und das zweite ist ein Objekt, also ein references Typ
const checkIn = function (fligtNumber, passenger) {
// value Typ
fligtNumber = "LHI926";
// reference Typ
passenger.name = "Mr. " + passenger.name;
if (passenger.passport === 32165474532) {
// alert("Checked In");
console.log("Checked In");
} else {
// alert("Wrong passport");
console.log("Wrong passport");
}
};
// reference vom urprünglichen Objekt
const david_reference = david;
// alles was wird in der david_reference Variable(Objekt) geändert, wird es auch bei der david Variable geändert, weil da es für das selbe Objekt geht
david_reference.name = "TEST";
// Änderung der PassportID
const newPassport = function (person) {
person.passport = Math.trunc(Math.random() * 100000000000);
};
console.log(david);
checkIn(flight, david);
newPassport(david);
console.log(david);
checkIn(flight, david);