Wywołanie funkcji JavaScript
Kod wewnątrz JavaScriptu functionzostanie wykonany, gdy „coś” go wywoła.
Wywoływanie funkcji JavaScript
Kod wewnątrz funkcji nie jest wykonywany, gdy funkcja jest zdefiniowana .
Kod wewnątrz funkcji jest wykonywany, gdy funkcja jest wywoływana .
Powszechnie używa się terminu „ wywołaj funkcję ” zamiast „wywołaj funkcję ”.
Często mówi się również „wywołaj funkcję”, „uruchom funkcję” lub „wykonaj funkcję”.
W tym samouczku użyjemy invoke , ponieważ funkcja JavaScript może zostać wywołana bez wywołania.
Wywoływanie funkcji jako funkcji
Przykład
function myFunction(a, b) {
return a * b;
}
myFunction(10, 2); //
Will return 20
Powyższa funkcja nie należy do żadnego obiektu. Ale w JavaScript zawsze istnieje domyślny obiekt globalny.
W HTML domyślnym obiektem globalnym jest sama strona HTML, więc funkcja powyżej "należy" do strony HTML.
W przeglądarce obiektem strony jest okno przeglądarki. Powyższa funkcja automatycznie staje się funkcją okna.
myFunction() i window.myFunction() to ta sama funkcja:
Przykład
function myFunction(a, b) {
return a * b;
}
window.myFunction(10, 2); // Will also return 20
Jest to powszechny sposób wywoływania funkcji JavaScript, ale niezbyt dobra praktyka.
Zmienne globalne, metody lub funkcje mogą łatwo tworzyć konflikty nazw i błędy w obiekcie globalnym.
To słowo kluczowe
W JavaScript rzecz o nazwie this, to obiekt, który jest „właścicielem” bieżącego kodu.
Wartość this, gdy jest używana w funkcji, jest obiektem, który jest „właścicielem” funkcji.
Zauważ, że thisto nie jest zmienna. To słowo kluczowe. Nie możesz zmienić wartości this.
Wskazówka: Przeczytaj więcej o thissłowie kluczowym w JS this Keyword .
Obiekt globalny
Kiedy funkcja jest wywoływana bez obiektu właściciela, wartość this
staje się obiektem globalnym.
W przeglądarce internetowej globalnym obiektem jest okno przeglądarki.
Ten przykład zwraca obiekt window jako wartość this:
Przykład
let x = myFunction();
// x will be the window object
function myFunction() {
return this;
}
Wywołanie funkcji jako funkcji globalnej powoduje, że jej wartością jest obiekt globalny.
Użycie obiektu window jako zmiennej może łatwo spowodować awarię programu.
Wywoływanie funkcji jako metody
W JavaScript możesz definiować funkcje jako metody obiektowe.
Poniższy przykład tworzy obiekt ( myObject ) z dwiema właściwościami ( firstName i lastName ) oraz metodą ( fullName ):
Przykład
const myObject = {
firstName:"John",
lastName: "Doe",
fullName: function () {
return this.firstName + " " + this.lastName;
}
}
myObject.fullName(); // Will return "John Doe"
Metoda fullName jest funkcją. Funkcja należy do obiektu. myObject jest właścicielem funkcji.
Rzecz o nazwie this, to obiekt, który jest „właścicielem” kodu JavaScript. W tym przypadku wartością this
jest myObject .
Sprawdź to! Zmień metodę fullName , aby zwracała wartość this:
Przykład
const myObject = {
firstName:"John",
lastName: "Doe",
fullName: function () {
return this;
}
}
// This will return [object Object] (the owner object)
myObject.fullName();
Wywołanie funkcji jako metody obiektu powoduje, że wartością this
jest sam obiekt.
Wywoływanie funkcji za pomocą konstruktora funkcji
Jeśli wywołanie funkcji jest poprzedzone newsłowem kluczowym, jest to wywołanie konstruktora.
Wygląda na to, że tworzysz nową funkcję, ale ponieważ funkcje JavaScript są obiektami, w rzeczywistości tworzysz nowy obiekt:
Przykład
// This is a function constructor:
function myFunction(arg1, arg2) {
this.firstName = arg1;
this.lastName = arg2;
}
// This creates a new object
const myObj = new myFunction("John", "Doe");
// This will return "John"
myObj.firstName;
Wywołanie konstruktora tworzy nowy obiekt. Nowy obiekt dziedziczy właściwości i metody ze swojego konstruktora.
Słowo thiskluczowe w konstruktorze nie ma wartości.
Wartość thisbędzie nowym obiektem utworzonym po wywołaniu funkcji.