JavaScript Function Definition

JavaScript functies worden gedefinieerd door function keyworddefiniërendefiniëren.

u kunt functies gebruikenVerklaringof functieExpressie.

functie-declaratie

In een eerdere les in deze cursus hebt u geleerd dat u functies kunt definiëren met de volgende syntaxVerklaringFunctie:

function functionName(parameters) {
   Code die moet worden uitgevoerd
}

Gedeclareerde functies worden niet direct uitgevoerd. Ze worden 'opgeslagen voor later gebruik' en zullen later worden uitgevoerd wanneer ze worden aangeroepen.

Voorbeeld

function myFunction(a, b) {
     return a * b;
}

Probeer het zelf uit

puntkomma's worden gebruikt om uitvoerbare JavaScript statements te scheiden.

Omdat functiesVerklaringzijn geen uitvoerbare statements en eindigen zelden met een puntkomma.

functie-expressies

JavaScript functies kunnen ookExpressieom te definiëren.

Een functie-expressie kan worden opgeslagen in een variabele:

Voorbeeld

var x = function (a, b) {return a * b};

Probeer het zelf uit

Na het opslaan van de functie-expressie in een variabele, kan deze variabele worden gebruikt als een functie:

Voorbeeld

var x = function (a, b) {return a * b};
var z = x(4, 3);

Probeer het zelf uit

De functie hierboven is eigenlijk eenAnonieme functie（naamloze functies）.

Functies die in variabelen worden opgeslagen hebben geen functienaam nodig. Ze worden altijd aangeroepen met de variabelenaam.

De functie hierboven eindigt met een puntkomma, omdat het een deel is van een uitvoerbare statement.

Function() constructor

Zoals u heeft gezien in de vorige voorbeeld, worden JavaScript functies gedefinieerd door function door een keyword gedefinieerd.

De functie kan ook worden gedefinieerd door een naam te geven Function() van de ingebouwde JavaScript-functieconstructor om te definiëren.

Voorbeeld

var myFunction = new Function("a", "b", "return a * b");
var x = myFunction(4, 3);

Probeer het zelf uit

Je hoeft echt geen functieconstructor te gebruiken. Het voorbeeld kan ook zo worden geschreven:

Voorbeeld

var myFunction = function (a, b) {return a * b};
var x = myFunction(4, 3);

Probeer het zelf uit

In de meeste gevallen kun je vermijden om new sleutelwoorden.

functiehoisting

In deze handleiding heb je al eerder geleerd over "hoisting" (hoisting).

Hoisting is het proces waarbij JavaScriptVerklaringStandaardgedrag om naar het begin van de huidige scope te verhuizen.

Hoisting wordt toegepast op variabele- en functie-declaraties.

Daarom kunnen JavaScript-functies voor de verklaring worden aangeroepen:

myFunction(5);
 function myFunction(y) {
     return y * y;
}

Gebruikte expressies om functies te definiëren, worden niet omhooggehaald.

Zelf-aanroepende functies

Functie-expressies kunnen als "zelf-aanroepend" worden gebruikt.

Zelf-aanroepende expressies worden automatisch aangeroepen (beginnen), zonder dat er een aanroep wordt gedaan.

Functie-expressies worden automatisch uitgevoerd, als er ().

Je kunt geen functie-declaratie zelf aanroepen.

Je moet haakjes om de functie heen toevoegen om aan te geven dat het een functie-expressie is:

Voorbeeld

(function () {
    var x = "Hello!!";      // Ik zal mezelf aanroepen
}();

Probeer het zelf uit

De functie hierboven is eigenlijk eenAnonieme zelf-aanroepende functies（naamloze functies）.

Functies kunnen als waarde worden gebruikt

JavaScript-functies kunnen als waarde worden gebruikt:

Voorbeeld

function myFunction(a, b) {
    return a * b;
}
var x = myFunction(4, 3);

Probeer het zelf uit

JavaScript-functies kunnen worden gebruikt in expressies:

Voorbeeld

function myFunction(a, b) {
    return a * b;
}
var x = myFunction(4, 3) * 2;

Probeer het zelf uit

functies objecten

In JavaScript zijn typeof De operator retourneert "function".

Maar het is het beste om JavaScript-functies te beschrijven als objecten.

Hebben alle JavaScript-functies:eigenschappenenMethode.

arguments.length Retourneert het aantal argumenten dat de functie bij het worden aangeroepen heeft ontvangen:

Voorbeeld

function myFunction(a, b) {
    return arguments.length;
}

Probeer het zelf uit

toString() De methode returnt een functie als string:

Voorbeeld

function myFunction(a, b) {
    return a * b;
}
var txt = myFunction.toString();

Probeer het zelf uit

Functies die zijn gedefinieerd als objecteigenschappen, worden objectmethoden genoemd.

Functies die zijn ontworpen om nieuwe objecten te creëren, worden objectconstructiefuncties (objectconstructeurs) genoemd.

Arrow functions

Arrow functions laten een korte syntaxis toe om functieexpressies te schrijven.

Je hebt geen function-sleutel, return-sleutel en accolades nodig.

Voorbeeld

// ES5
var x = function(x, y) {
  return x * y;
}
// ES6
const x = (x, y) => x * y;

Probeer het zelf uit

Arrow functions hebben geen eigen this. Ze zijn niet geschikt voor het definiëren van objectmethoden.

Arrow functions worden niet opgeheven. Ze moeten voor gebruik worden gedefinieerd.

Gebruik van const is veiliger dan var, omdat de functieexpressie altijd een constante waarde is.

Als de functie een enkele statement is, kan alleen de return-sleutel en de accolades worden weggelaten. Daarom kan het een goede gewoonte zijn om deze te behouden:

Voorbeeld

const x = (x, y) => { return x * y };

Probeer het zelf uit

IE11 of eerder ondersteunt geen arrow functions.