JavaScript -functieaanroep
De code in een JavaScript function
wordt uitgevoerd wanneer "iets" het aanroept.
Een JavaScript-functie aanroepen
De code binnen een functie wordt niet uitgevoerd wanneer de functie is gedefinieerd .
De code binnen een functie wordt uitgevoerd wanneer de functie wordt aangeroepen .
Het is gebruikelijk om de term " een functie aanroepen " te gebruiken in plaats van " een functie aanroepen ".
Het is ook gebruikelijk om te zeggen "een functie aanroepen", "een functie starten" of "een functie uitvoeren".
In deze tutorial gebruiken we invoke , omdat een JavaScript-functie kan worden aangeroepen zonder te worden aangeroepen.
Een functie aanroepen als een functie
Voorbeeld
function myFunction(a, b) {
return a * b;
}
myFunction(10, 2); //
Will return 20
Bovenstaande functie hoort bij geen enkel object. Maar in JavaScript is er altijd een standaard globaal object.
In HTML is het standaard globale object de HTML-pagina zelf, dus de functie hierboven "hoort" bij de HTML-pagina.
In een browser is het pagina-object het browservenster. Bovenstaande functie wordt automatisch een vensterfunctie.
myFunction() en window.myFunction() is dezelfde functie:
Voorbeeld
function myFunction(a, b) {
return a * b;
}
window.myFunction(10, 2); // Will also return 20
Dit is een veelgebruikte manier om een JavaScript-functie aan te roepen, maar het is geen goede gewoonte.
Globale variabelen, methoden of functies kunnen gemakkelijk naamconflicten en bugs in het globale object veroorzaken.
Het dit trefwoord
In JavaScript is het ding genaamd this
, het object dat de huidige code "bezit".
De waarde van this
, wanneer gebruikt in een functie, is het object dat de functie "bezit".
Merk op dat this
dit geen variabele is. Het is een sleutelwoord. U kunt de waarde van niet wijzigen this
.
Tip: Lees meer over het this
zoekwoord bij JS dit Zoekwoord .
Het globale object
Wanneer een functie wordt aangeroepen zonder een owner-object, this
wordt de waarde van het globale object.
In een webbrowser is het globale object het browservenster.
Dit voorbeeld retourneert het window-object als de waarde van this
:
Voorbeeld
let x = myFunction();
// x will be the window object
function myFunction() {
return this;
}
Door een functie als globale functie aan te roepen, wordt de waarde hiervan het globale object.
Als u het vensterobject als variabele gebruikt, kan uw programma gemakkelijk crashen.
Een functie aanroepen als een methode
In JavaScript kunt u functies definiëren als objectmethoden.
In het volgende voorbeeld wordt een object ( myObject ) gemaakt met twee eigenschappen ( firstName en lastName ) en een methode ( fullName ):
Voorbeeld
const myObject = {
firstName:"John",
lastName: "Doe",
fullName: function () {
return this.firstName + " " + this.lastName;
}
}
myObject.fullName(); // Will return "John Doe"
De methode fullName is een functie. De functie hoort bij het object. myObject is de eigenaar van de functie.
Het ding genaamd this
, is het object dat de JavaScript-code "bezit". this
In dit geval is de waarde van myObject .
Test het! Wijzig de methode fullName om de waarde te retourneren van this
:
Voorbeeld
const myObject = {
firstName:"John",
lastName: "Doe",
fullName: function () {
return this;
}
}
// This will return [object Object] (the owner object)
myObject.fullName();
Het aanroepen van een functie als objectmethode zorgt ervoor dat de waarde van this
het object zelf is.
Een functie aanroepen met een functieconstructor
Als een functie-aanroep wordt voorafgegaan door het new
sleutelwoord, is het een constructor-aanroep.
Het lijkt erop dat u een nieuwe functie maakt, maar aangezien JavaScript-functies objecten zijn, maakt u in feite een nieuw object:
Voorbeeld
// 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;
Een aanroep van een constructor maakt een nieuw object aan. Het nieuwe object erft de eigenschappen en methoden van zijn constructor.
Het this
sleutelwoord in de constructor heeft geen waarde.
De waarde van this
is het nieuwe object dat wordt gemaakt wanneer de functie wordt aangeroepen.