Heim Web-Frontend js-Tutorial Eine kurze Diskussion über den Unterschied zwischen Javascript-Funktionsausdrücken und Funktionsdeklarationen_Javascript-Fähigkeiten

Eine kurze Diskussion über den Unterschied zwischen Javascript-Funktionsausdrücken und Funktionsdeklarationen_Javascript-Fähigkeiten

May 16, 2016 pm 03:21 PM
javascript 函数声明

Es gibt zwei Möglichkeiten, Funktionen in JavaScript zu deklarieren: Funktionsdeklaration und Funktionsausdruck.

Die Unterschiede sind wie folgt:

1). Für durch Funktionsdeklaration definierte Funktionen ist der Funktionsname erforderlich, während der Funktionsname des Funktionsausdrucks optional ist.

2). Bei durch Funktionsdeklaration definierten Funktionen kann die Funktion vor der Funktionsdeklaration aufgerufen werden, während die Funktion des Funktionsausdrucks erst nach der Deklaration aufgerufen werden kann.

3). Durch Funktionsdeklaration definierte Funktionen sind keine echten Deklarationen. Sie können nur global oder verschachtelt in anderen Funktionen erscheinen, aber sie können nicht in Schleifen, Bedingungen oder try/catch/finally erscheinen und

Funktionsausdrücke können überall deklariert werden.

Die Funktionen werden im Folgenden auf zwei Arten definiert:

 //函数声明式
 function greeting(){
    console.log("hello world"); 
 }
 
 
 //函数表达式
 var greeting = function(){
   console.log("hello world"); 
 }

Nach dem Login kopieren

Ein interessantes Javascript unten:

function f() { console.log('I am outside!'); }
(function () {
 if(false) {
  // 重复声明一次函数f
  function f() { console.log('I am inside!'); }
 }
 f();
}());

Nach dem Login kopieren

Was wird ausgegeben? Die erste Reaktion sollte „Ich bin draußen“ sein. Das Ergebnis ist „Ich bin drinnen“, IE11 meldet direkt einen Fehler und die niedrigere Version von Firefox gibt „Ich bin draußen“ aus. .

Die von Chrome ausgegebenen Ergebnisse spiegeln deutlich die Merkmale von Funktionen wider, die mithilfe von Funktionsdeklarationen deklariert wurden – die Funktion kann aufgerufen werden, bevor sie deklariert wird.

IE-Fehler zeigt an, dass das Objekt fehlt, weil die Funktion in der Bedingung deklariert ist, was gegen das Prinzip der Funktionsdeklaration verstößt.

Umfang des Funktionsausdrucks:

Wenn die durch den Funktionsausdruck deklarierte Funktion einen Funktionsnamen hat, entspricht der Funktionsname einer lokalen Variablen der Funktion und kann nur innerhalb der Funktion aufgerufen werden:

var f = function fact(x) { 
        if (x <= 1) 
          return 1;
        else 
          return x*fact(x-1);
        };
        alert(fact());  // Uncaught ReferenceError: fact is not defined

Nach dem Login kopieren

fact() kann innerhalb der Funktion aufgerufen werden, aber wenn es außerhalb der Funktion aufgerufen wird, wird ein Fehler gemeldet: fact ist undefiniert.
Tatsache

Lassen Sie uns einen genaueren Blick darauf werfen

Funktionsdeklaration

Beispielcode für die Funktionsdeklaration

Der Code lautet wie folgt:

function fn () {
  console.log('fn 函数执行..');
  // code..
}

Nach dem Login kopieren

Auf diese Weise haben wir eine Funktion namens fn deklariert. Glauben Sie, dass sie ausgeführt wird, wenn Sie sie zusätzlich zu dieser Funktion aufrufen? Oder wird ein Fehler gemeldet?

Der Code lautet wie folgt: fn(); // Rufen Sie die vor der Funktion deklarierte fn-Funktion auf fn () { console.log('fn-Funktionsausführung..'); // code..}

Konsolenausgabe:

Ja, die Fn-Funktion kann zu diesem Zeitpunkt aufgerufen werden. Hier ist eine Zusammenfassung der Gründe.

Zusammenfassung:

1: Zu diesem Zeitpunkt ist die fn-Funktion das Ergebnis der Variablen, die standardmäßig in der Variablen des globalen Kontexts gespeichert wird (kann anhand des Namens der window.function überprüft werden)

 2: Diese Methode ist eine Funktionsdeklaration, die beim Eintritt in die globale Kontextphase erstellt wird. Sie ist bereits während der Codeausführungsphase verfügbar. ps: JavaScript initialisiert die Kontextumgebung (von global → lokal) jedes Mal, wenn es eine Methode

betritt

 3: Es kann sich auf variable Objekte auswirken (nur im Kontext gespeicherte Variablen)

Funktionsausdruck

Beispielcode für einen Funktionsausdruck

Der Code lautet wie folgt:

var fn = function () {
  console.log('fn 函数【表达式】声明执行..')
  // code..
}

Nach dem Login kopieren

 Auf diese Weise deklarieren wir eine anonyme Funktion und verweisen ihren Verweis auf die Variable fn?

Rufen Sie die durch den Ausdruck oben und unten deklarierte Funktion noch einmal auf, um die Ausgabe auf der Konsole anzuzeigen.

Der Code lautet wie folgt:

// 为了清晰的看到控制台的输出,我们在各自调用前后做个标记,增加可读性。
console.log('之前调用开始..');
fn();
console.log('之前调用结束..');
var fn = function () {
  console.log('fn 函数【表达式】声明执行..')
  // code..
}
console.log('之后调用开始..');
fn();
console.log('之后调用开始..');

Nach dem Login kopieren

Konsolendruckergebnis:

Sie können sehen, dass, wenn der Code ausgeführt wird und die Funktion fn() zum ersten Mal aufgerufen wird, Folgendes angezeigt wird: fn ist keine Funktion (fn ist keine Methode) und der Vorgang wird beendet, wenn ein Fehler auftritt angetroffen.

Dies zeigt, dass beim ersten Aufruf von fn() die Variable var fn nicht als Attribut des globalen Objekts vorhanden ist und der von fn referenzierte anonyme Funktionskontext nicht initialisiert wurde, sodass der vorherige Aufruf fehlgeschlagen ist .

Der Code lautet wie folgt:

// 现在先把之前的调用逻辑给注释掉,再看下控制台的输出
//  console.log('之前调用开始..');
//  fn();
//  console.log('之前调用结束..');
  var fn = function () {
    console.log('fn 函数【表达式】声明执行..')
    // code..
  }
  console.log('之后调用开始..');
  fn(); // 在表达式之后调用
  console.log('之后调用开始..');

Nach dem Login kopieren

Konsolendruckergebnis:

Es ist ersichtlich, dass es möglich ist, nach der Ausdrucksfunktion aufzurufen. Fassen wir zusammen, warum?

Zusammenfassung:

1: Erstens existiert die Variable selbst nicht als Funktion, sondern als Referenz auf eine anonyme Funktion (Werttypen sind keine Referenzen)

2: Während der Codeausführungsphase, wenn der globale Kontext initialisiert wird, existiert er nicht als globales Attribut, sodass keine Verschmutzung variabler Objekte verursacht wird

3: Diese Art der Deklaration ist in der Plug-in-Entwicklung allgemein üblich und kann auch als Aufruf einer Callback-Funktion in einem Abschluss

verwendet werden

 Funktion fn () {} ist also nicht gleich var fn = Funktion () {} Sie sind im Wesentlichen unterschiedlich.

Das Obige ist der gesamte Inhalt dieses Artikels und der Vergleich ist auch sehr klar. Freunde, Sie müssen ihn sorgfältig lesen

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Standardparameter in C++-Funktionsdeklarationen: eine umfassende Analyse ihrer Deklaration und Verwendung Standardparameter in C++-Funktionsdeklarationen: eine umfassende Analyse ihrer Deklaration und Verwendung May 02, 2024 pm 03:09 PM

Standardparameter in C++ bieten die Möglichkeit, Standardwerte für Funktionsparameter anzugeben und so die Lesbarkeit, Einfachheit und Flexibilität des Codes zu verbessern. Standardparameter deklarieren: Fügen Sie nach dem Parameter in der Funktionsdeklaration das Symbol „=“ hinzu, gefolgt vom Standardwert. Verwendung: Wenn die Funktion aufgerufen wird und keine optionalen Parameter bereitgestellt werden, werden die Standardwerte verwendet. Praktischer Fall: Eine Funktion, die die Summe zweier Zahlen berechnet. Ein Parameter ist erforderlich, der andere ist optional und hat den Standardwert 0. Vorteile: Verbesserte Lesbarkeit, erhöhte Flexibilität, reduzierter Boilerplate-Code. Hinweis: Es kann nur in der Deklaration angegeben werden, es muss am Ende stehen und die Typen müssen kompatibel sein.

So implementieren Sie ein Online-Spracherkennungssystem mit WebSocket und JavaScript So implementieren Sie ein Online-Spracherkennungssystem mit WebSocket und JavaScript Dec 17, 2023 pm 02:54 PM

So implementieren Sie mit WebSocket und JavaScript ein Online-Spracherkennungssystem. Einführung: Mit der kontinuierlichen Weiterentwicklung der Technologie ist die Spracherkennungstechnologie zu einem wichtigen Bestandteil des Bereichs der künstlichen Intelligenz geworden. Das auf WebSocket und JavaScript basierende Online-Spracherkennungssystem zeichnet sich durch geringe Latenz, Echtzeit und plattformübergreifende Eigenschaften aus und hat sich zu einer weit verbreiteten Lösung entwickelt. In diesem Artikel wird erläutert, wie Sie mit WebSocket und JavaScript ein Online-Spracherkennungssystem implementieren.

WebSocket und JavaScript: Schlüsseltechnologien zur Implementierung von Echtzeitüberwachungssystemen WebSocket und JavaScript: Schlüsseltechnologien zur Implementierung von Echtzeitüberwachungssystemen Dec 17, 2023 pm 05:30 PM

WebSocket und JavaScript: Schlüsseltechnologien zur Realisierung von Echtzeit-Überwachungssystemen Einführung: Mit der rasanten Entwicklung der Internet-Technologie wurden Echtzeit-Überwachungssysteme in verschiedenen Bereichen weit verbreitet eingesetzt. Eine der Schlüsseltechnologien zur Erzielung einer Echtzeitüberwachung ist die Kombination von WebSocket und JavaScript. In diesem Artikel wird die Anwendung von WebSocket und JavaScript in Echtzeitüberwachungssystemen vorgestellt, Codebeispiele gegeben und deren Implementierungsprinzipien ausführlich erläutert. 1. WebSocket-Technologie

Verwendung von JavaScript und WebSocket zur Implementierung eines Echtzeit-Online-Bestellsystems Verwendung von JavaScript und WebSocket zur Implementierung eines Echtzeit-Online-Bestellsystems Dec 17, 2023 pm 12:09 PM

Einführung in die Verwendung von JavaScript und WebSocket zur Implementierung eines Online-Bestellsystems in Echtzeit: Mit der Popularität des Internets und dem Fortschritt der Technologie haben immer mehr Restaurants damit begonnen, Online-Bestelldienste anzubieten. Um ein Echtzeit-Online-Bestellsystem zu implementieren, können wir JavaScript und WebSocket-Technologie verwenden. WebSocket ist ein Vollduplex-Kommunikationsprotokoll, das auf dem TCP-Protokoll basiert und eine bidirektionale Kommunikation zwischen Client und Server in Echtzeit realisieren kann. Im Echtzeit-Online-Bestellsystem, wenn der Benutzer Gerichte auswählt und eine Bestellung aufgibt

Welchen Einfluss hat die Reihenfolge der Deklaration und Definition von C++-Funktionen? Welchen Einfluss hat die Reihenfolge der Deklaration und Definition von C++-Funktionen? Apr 19, 2024 pm 01:42 PM

In C++ wirkt sich die Reihenfolge der Funktionsdeklarationen und -definitionen auf den Kompilierungs- und Verknüpfungsprozess aus. Am gebräuchlichsten ist die Deklaration zuerst und die Definition danach; Sie können auch „forwarddeclaration“ verwenden, um die Definition vor der Deklaration zu platzieren. Wenn beide gleichzeitig vorhanden sind, ignoriert der Compiler die Deklaration und verwendet nur die Definition.

So implementieren Sie ein Online-Reservierungssystem mit WebSocket und JavaScript So implementieren Sie ein Online-Reservierungssystem mit WebSocket und JavaScript Dec 17, 2023 am 09:39 AM

So implementieren Sie ein Online-Reservierungssystem mit WebSocket und JavaScript. Im heutigen digitalen Zeitalter müssen immer mehr Unternehmen und Dienste Online-Reservierungsfunktionen bereitstellen. Es ist von entscheidender Bedeutung, ein effizientes Online-Reservierungssystem in Echtzeit zu implementieren. In diesem Artikel wird erläutert, wie Sie mit WebSocket und JavaScript ein Online-Reservierungssystem implementieren, und es werden spezifische Codebeispiele bereitgestellt. 1. Was ist WebSocket? WebSocket ist eine Vollduplex-Methode für eine einzelne TCP-Verbindung.

JavaScript und WebSocket: Aufbau eines effizienten Echtzeit-Wettervorhersagesystems JavaScript und WebSocket: Aufbau eines effizienten Echtzeit-Wettervorhersagesystems Dec 17, 2023 pm 05:13 PM

JavaScript und WebSocket: Aufbau eines effizienten Echtzeit-Wettervorhersagesystems Einführung: Heutzutage ist die Genauigkeit von Wettervorhersagen für das tägliche Leben und die Entscheidungsfindung von großer Bedeutung. Mit der Weiterentwicklung der Technologie können wir genauere und zuverlässigere Wettervorhersagen liefern, indem wir Wetterdaten in Echtzeit erhalten. In diesem Artikel erfahren Sie, wie Sie mit JavaScript und WebSocket-Technologie ein effizientes Echtzeit-Wettervorhersagesystem aufbauen. In diesem Artikel wird der Implementierungsprozess anhand spezifischer Codebeispiele demonstriert. Wir

Einfaches JavaScript-Tutorial: So erhalten Sie den HTTP-Statuscode Einfaches JavaScript-Tutorial: So erhalten Sie den HTTP-Statuscode Jan 05, 2024 pm 06:08 PM

JavaScript-Tutorial: So erhalten Sie HTTP-Statuscode. Es sind spezifische Codebeispiele erforderlich. Vorwort: Bei der Webentwicklung ist häufig die Dateninteraktion mit dem Server erforderlich. Bei der Kommunikation mit dem Server müssen wir häufig den zurückgegebenen HTTP-Statuscode abrufen, um festzustellen, ob der Vorgang erfolgreich ist, und die entsprechende Verarbeitung basierend auf verschiedenen Statuscodes durchführen. In diesem Artikel erfahren Sie, wie Sie mit JavaScript HTTP-Statuscodes abrufen und einige praktische Codebeispiele bereitstellen. Verwenden von XMLHttpRequest

See all articles