JavaSkriptdefinition und Aufruf von Funktionen mit Beispiel
James Hartmann
⚡ Intelligente Zusammenfassung
JavaSkriptfunktionen gruppieren wiederverwendbare Codeblöcke, die nur bei Aufruf ausgeführt werden. Diese Anleitung zeigt, wie man eine solche Funktion deklariert, ihr Argumente übergibt und einen Wert an den Aufrufer zurückgibt.
Was ist Funktion in JavaSkript?
Funktionen sind in jeder Programmiersprache sehr wichtig und nützlich, da sie Code wiederverwendbar machen. Eine Funktion ist ein Codeblock, der nur dann ausgeführt wird, wenn er aufgerufen wird. Wenn Sie einige Codezeilen haben, die mehrmals verwendet werden müssen, können Sie eine Funktion erstellen, die diese wiederkehrenden Codezeilen enthält, und diese Funktion dann an beliebiger Stelle aufrufen.
Innerhalb der geschweiften Klammern wird kein Codeblock ausgeführt. Der Browser speichert den Block unter dem von Ihnen vergebenen Namen, und der Code wird nur ausgeführt, wenn dieser Name in Klammern gesetzt wird, z. B. myFunction()Funktionen stehen daher im Mittelpunkt jedes JavaSkript Programm, ob das Skript lebt innerhalb der Seite oder in einer externen Datei.
So erstellen Sie eine Funktion in JavaSkript
- Verwenden Sie das Schlüsselwort Funktion gefolgt vom Namen der Funktion.
- Öffnen und schließen Sie nach dem Funktionsnamen Klammern.
- Öffnen und schließen Sie nach der Klammer die geschweiften Klammern.
- Schreiben Sie in geschweiften Klammern Ihre Codezeilen.
Syntax:
function functionname()
{
lines of code to be executed
}
Das folgende Beispiel definiert myFunction() und ruft die Funktion dann in der nächsten Zeile auf, sodass die Meldung sofort nach dem Laden der Seite erscheint. Probieren Sie es selbst aus:
<html>
<head>
<title>Functions!!!</title>
<script type="text/javascript">
function myFunction()
{
document.write("This is a simple function.<br />");
}
myFunction();
</script>
</head>
<body>
</body>
</html>
Funktion mit Argumenten
Sie können auch Funktionen mit Argumenten erstellen. Die Argumente müssen in Klammern angegeben werden.
Syntax:
function functionname(arg1, arg2)
{
lines of code to be executed
}
Hier countVowels() Empfängt den vom Besucher eingegebenen Namen, durchläuft jedes Zeichen und gibt die Anzahl der enthaltenen Vokale aus. Probieren Sie es selbst aus:
<html>
<head>
<script type="text/javascript">
var count = 0;
function countVowels(name)
{
for (var i=0;i<name.length;i++)
{
if(name[i] == "a" || name[i] == "e" || name[i] == "i" || name[i] == "o" || name[i] == "u")
count = count + 1;
}
document.write("Hello " + name + "!!! Your name has " + count + " vowels.");
}
var myName = prompt("Please enter your name");
countVowels(myName);
</script>
</head>
<body>
</body>
</html>
JavaSkript-Rückgabewert
Sie können auch JS-Funktionen erstellen, die Werte zurückgeben. Innerhalb der Funktion müssen Sie das Schlüsselwort verwenden Rückkehr gefolgt vom zurückzugebenden Wert.
Syntax:
function functionname(arg1, arg2) { lines of code to be executed return val1; }
In diesem letzten Beispiel returnSum() Die Funktion gibt das Ergebnis an die aufrufende Zeile zurück, sodass es in einen Satz eingebunden werden kann, anstatt innerhalb der Funktion ausgegeben zu werden. Probieren Sie es selbst aus:
<html>
<head>
<script type="text/javascript">
function returnSum(first, second)
{
var sum = first + second;
return sum;
}
var firstNo = 78;
var secondNo = 22;
document.write(firstNo + " + " + secondNo + " = " + returnSum(firstNo,secondNo));
</script>
</head>
<body>
</body>
</html>
Funktionstypen in JavaSkript
Die drei obigen Beispiele verwenden alle die klassische Funktionsdeklaration, aber moderne JavaDas Skript bietet mehrere weitere Formen an. Sie unterscheiden sich hauptsächlich darin, ob die Maschine sie anhebt und wie jede einzelne die this Stichwort.
| Funktionsart | Typische Syntax | Wann wird es verwendet? |
|---|---|---|
| Funktionsdeklaration | function greet() { } | Benannte, wiederverwendbare Logik; an die Spitze ihres Gültigkeitsbereichs verschoben. |
| Funktionsausdruck | const greet = function () { }; | Eine Funktion in einer Variablen speichern; nicht gehoisted. |
| Pfeilfunktion (ES6) | const greet = () => { }; | Kurze Rückruffunktionen; erbt dies vom umgebenden Gültigkeitsbereich |
| Anonyme Funktion | setTimeout(function () { }, 100); | Einmalige Logik wird direkt an eine andere Funktion übergeben. |
| IIFE | (function () { })(); | Wird sofort ausgeführt und hält seine Variablen privat |
| Rückruf | items.forEach(showItem); | Eine Funktion, die an eine andere Funktion übergeben und später aufgerufen wird. |
Anmerkung zu den obigen Beispielen: die historischen Beispiele verwenden var und document.write()Beide laufen weiterhin in jedem Browser. Die gängige Praxis deklariert Variablen mit let or const und druckt Ausgaben über console.log() oder durch Einstellen textContent auf einem Element, weil document.write() Löscht eine Seite, die bereits vollständig geladen wurde. type="text/javascript" Das Attribut ist auch in HTML5 optional.
Funktionsparameter, Argumente und Standardwerte
Parameter sind die in der Definition aufgeführten Platzhalternamen, während Argumente die tatsächlichen Werte sind, die beim Aufruf der Funktion übergeben werden. countVowels(name) über, name ist der Parameter und der in die Eingabeaufforderung eingegebene Text ist das Argument.
function greet(user, greeting = "Hello") { return greeting + ", " + user; } greet("Ann"); greet("Ann", "Welcome");
- Ein Parameter ohne passendes Argument wird zu
undefinedsofern kein Standardwert angegeben wird,greetingist hier. - Zusätzliche Argumente werden von der Parameterliste ignoriert, bleiben aber über die
argumentsObjekt innerhalb einer beliebigen Funktion, die kein Pfeil ist. - Ein Restparameter, geschrieben als
...valuesfasst alle verbleibenden Argumente zu einem echten Array.
Funktionsumfang und Hebezeuge in JavaSkript
Der Ort, an dem eine Funktion geschrieben ist, bestimmt, worauf sie zugreifen kann und wann sie aufgerufen werden kann. Zwei Regeln erklären fast alle Überraschungen, denen Anfänger begegnen.
- Heben: Funktionsdeklarationen werden vor der Skriptausführung an den Anfang ihres Gültigkeitsbereichs verschoben, sodass sie in einer Zeile oberhalb ihrer Definition aufgerufen werden können. Funktionsausdrücke und Pfeilfunktionen werden nicht verschoben und führen zu einem Fehler, wenn sie zu früh aufgerufen werden.
- Umfang: Variablen, die mit
varInnerhalb einer Funktion sind Ausdrücke in der gesamten Funktion sichtbar, währendletundconstsind auf den Block beschränkt, in dem sie sich befinden. Alles, was außerhalb jeder Funktion deklariert wird, ist global.
Der Vokalzähler veranschaulicht dies in der Praxis. count Die Variable wird außerhalb der Funktion deklariert, daher der Aufruf countVowels() Bei einem zweiten Aufruf auf derselben Seite wird die Summe fortlaufend erhöht, anstatt wieder bei Null zu beginnen. Würde die Deklaration in die Funktion verschoben, würde sie bei jedem Aufruf zurückgesetzt.
Diese Schottenping Die Regeln gelten auch für serverseitigen Code, weshalb die gleiche Argumentation auch für Funktionen gilt, die für Node.jsund warum Funktionsverhalten so häufig auftritt in JavaDrehbuchinterviewfragen.
