JavaScript-Ausführungsreihenfolge

Das Entwerfen Ihrer Webseite mit JavaScript erfordert die Beachtung der Reihenfolge, in der Ihr Code angezeigt wird, und ob Sie Code in Funktionen oder Objekte einkapseln, was sich auf die Reihenfolge auswirkt, in der der Code ausgeführt wird. 

Die Position von JavaScript auf Ihrer Webseite

Da das JavaScript auf Ihrer Seite basierend auf bestimmten Faktoren ausgeführt wird, sollten Sie sich überlegen, wo und wie Sie einer Webseite JavaScript hinzufügen. 

Grundsätzlich gibt es drei Stellen, an die wir JavaScript anhängen können:

• Direkt in den Kopf der Seite
• Direkt in den Hauptteil der Seite
• Von einem Ereignishandler / Listener

Es macht keinen Unterschied, ob sich das JavaScript auf der Webseite selbst oder in externen Dateien befindet, die mit der Seite verlinkt sind. Es spielt auch keine Rolle, ob die Ereignishandler fest auf der Seite codiert sind oder vom JavaScript selbst hinzugefügt wurden (außer dass sie nicht ausgelöst werden können, bevor sie hinzugefügt wurden)..

Code direkt auf der Seite

Was bedeutet es zu sagen, dass JavaScript ist direkt im Kopf oder Körper der Seite? Wenn der Code nicht in einer Funktion oder einem Objekt enthalten ist, befindet er sich direkt auf der Seite. In diesem Fall wird der Code nacheinander ausgeführt, sobald die Datei, die den Code enthält, ausreichend geladen wurde, damit auf diesen Code zugegriffen werden kann.

Code, der sich in einer Funktion oder einem Objekt befindet, wird nur ausgeführt, wenn diese Funktion oder dieses Objekt aufgerufen wird.

Grundsätzlich bedeutet dies, dass jeder Code im Kopf und Körper Ihrer Seite, der sich nicht in einer Funktion oder einem Objekt befindet, beim Laden der Seite ausgeführt wird - sobald die Seite geladen ist hat ausreichend geladen, um auf diesen Code zuzugreifen.

Das letzte Bit ist wichtig und wirkt sich auf die Reihenfolge aus, in der Sie Ihren Code auf der Seite platzieren: Jeder Code, der direkt auf der Seite platziert wird und mit Elementen auf der Seite interagieren muss, muss angezeigt werden nach die Elemente auf der Seite, von denen es abhängig ist.

Im Allgemeinen bedeutet dies, dass, wenn Sie direkten Code für die Interaktion mit Ihrem Seiteninhalt verwenden, dieser Code am unteren Rand des Texts platziert werden sollte.

Code innerhalb von Funktionen und Objekten

Ein Code innerhalb von Funktionen oder Objekten wird immer dann ausgeführt, wenn diese Funktion oder dieses Objekt aufgerufen wird. Wenn es aus Code aufgerufen wird, der sich direkt im Kopf oder Hauptteil der Seite befindet, ist sein Platz in der Ausführungsreihenfolge effektiv der Punkt, an dem die Funktion oder das Objekt aus dem direkten Code aufgerufen wird.

Code, der Ereignishandlern und Listenern zugewiesen ist

Das Zuweisen einer Funktion zu einem Ereignishandler oder Listener führt nicht dazu, dass die Funktion an dem Punkt ausgeführt wird, an dem sie zugewiesen wurde - vorausgesetzt, Sie sind es tatsächlich zuweisen die Funktion selbst und nicht laufen die Funktion und die Zuweisung des zurückgegebenen Wertes. (Deshalb sehen Sie in der Regel das nicht () am Ende des Funktionsnamens, wenn er einem Ereignis zugewiesen wird, da durch das Hinzufügen der Klammern die Funktion ausgeführt und der zurückgegebene Wert zugewiesen wird, anstatt die Funktion selbst zuzuweisen.)

Funktionen, die an Ereignishandler und Listener angehängt sind, werden ausgeführt, wenn das Ereignis, an das sie angehängt sind, ausgelöst wird. Die meisten Ereignisse werden von Besuchern ausgelöst, die mit Ihrer Seite interagieren. Es gibt jedoch einige Ausnahmen, wie z Belastung Ereignis im Fenster selbst, das ausgelöst wird, wenn die Seite vollständig geladen ist.

An Ereignisse auf Seitenelementen angehängte Funktionen