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:
parent
b07eb647cf
commit
4db15ab3e2
57
javascript/Javascript Expert/chapter10/applyAndCallMethod.js
Normal file
57
javascript/Javascript Expert/chapter10/applyAndCallMethod.js
Normal 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);
|
||||
@ -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);
|
||||
@ -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");
|
||||
@ -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>
|
||||
|
||||
38
javascript/Javascript Expert/chapter10/valueVsReference.js
Normal file
38
javascript/Javascript Expert/chapter10/valueVsReference.js
Normal 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);
|
||||
Loading…
x
Reference in New Issue
Block a user