Inhaltsverzeichnis
Bedingte Anweisungen
Nachschlagetabelle
Ternärer Operator
Heim Web-Frontend js-Tutorial Leistungsprobleme mit bedingten JavaScript-Anweisungen

Leistungsprobleme mit bedingten JavaScript-Anweisungen

Feb 28, 2017 pm 02:48 PM
javascript 性能问题 条件语句

Bedingte Anweisungen

Wie Schleifen ändern auch bedingte Anweisungen den laufenden Ablauf
Es gibt zwei Arten von bedingten Anweisungen in JavaScript

  • if-else

  • Schalter

if-else ist unser am häufigsten verwendeter Schalter
Aber if - Die else-Anweisung und die switch-Anweisung können in vielen Fällen durcheinander ersetzt werden
Zum Beispiel ist der folgende Code gleichwertig

if(foo){    ...}else{    ...}
Nach dem Login kopieren
switch(foo){
    case true:        ...
    default:        ...}
Nach dem Login kopieren

Wenn es wenige Bedingungen gibt, sind Menschen wahrscheinlicher if-else verwenden
Aber die Bedingung Mehrere Schalter scheint einfacher zu verstehen

if(foo === 1){    
...}else if(foo === 2){    
...}else if(foo === 3){    
...}else if(foo === 4){    
...}else{    
...}
Nach dem Login kopieren
switch(foo){
    case 1:        ...
    case 2:        ...
    case 3:        ...
    case 4:        ...
    default:        ...}
Nach dem Login kopieren

Aber welche der beiden Bedingungsanweisungen, die wir verwenden, hat eine bessere Leistung
Wenn die Anzahl der Bedingungen beträgt Wenn die Switch-Anweisung sehr groß ist, wird sie schneller und offensichtlicher ausgeführt.
Genauer gesagt: Wenn die Bedingungen zunehmen, steigt die Leistungsbelastung für if-else stärker
(die meisten Sprach-Switch-Anweisungen verwenden Verzweigungstabellen-Verzweigungstabellenindizes). optimieren)
Und in JavaScript erfolgt keine erzwungene Typkonvertierung in der Switch-Anweisung
Das heißt, der Kongruenzoperator wird zum Vergleich verwendet
Auf diese Weise kommt es zu keinem Verlust der Typkonvertierung

Also verwenden wir if-, wenn die Anzahl der Bedingungen gering ist, sonst, wenn es viele Bedingungen gibt, ist es aus Leistungssicht sinnvoll, den Schalter
zu verwenden
(if-else eignet sich zur Beurteilung zweier diskreter Werte ​​oder mehrere verschiedene Wertebereiche, Schalter eignet sich zur Beurteilung mehrerer diskreter Werte)


Wenn wir if-else-Anweisungen verwenden, sollten wir sie in der Reihenfolge von großen zu kleinen Wahrscheinlichkeiten anordnen
Das ist einfach zu verstehen, wird aber von uns leicht ignoriert.
Ein weiterer Optimierungspunkt besteht darin, zu versuchen, if-else in eine Reihe verschachtelter if-else-Anweisungen zu organisieren.
Dies ähnelt unserer mathematischen Dichotomie, die reduziert werden kann der Umfang und die Ausführungszeit
So

if(foo >= 1 && foo < 3){
    //...}else if(foo >= 3 && foo < 5){
    //...}else if(foo >= 5 && foo < 7){
    //...}else{
    //...}
Nach dem Login kopieren

Ändern Sie dazu

if(foo >= 1 && foo < 5){    if(foo < 3){
        //...
    }else{
        //...
    }
}else{    if(foo < 7){
        //...
    }else{
        //...
    }
}
Nach dem Login kopieren

Kann die Effizienz verbessern

Nachschlagetabelle

In einigen Fällen In besonderen Fällen bietet die Verwendung der Methode „Nachschlagetabelle“ eine sehr hohe Leistung, wenn eine große Anzahl von Bedingungen vorliegt. Weiter

function fn(a){
    switch(a){        
    case 0:            
    return 0;        
    case 1:            
    return 1;        
    case 2:            
    return 2;        
    case 3:            
    return 3;        
    case 4:            
    return 4;        
    case 5:            
    return 5;        
    case 6:            
    return 6;        
    case 7:            
    return 7;
    }
}
Nach dem Login kopieren

Strukturieren Sie die obige Funktion in diese um

function fn(a){
    var retArr = [0,1,2,3,4,5,6,7];    return retArr[a];
}
Nach dem Login kopieren

Dies ist nicht nur prägnant und lesbar, sondern bietet auch eine bessere Leistung
Wenn die Anzahl der Bedingungen zunimmt, erzeugt die Nachschlagetabelle fast keinen zusätzlichen Leistungsaufwand
Aber sie eignet sich besser für Situationen, in denen eine logische Zuordnung zwischen a einzelner Schlüssel und ein einzelner Wert

Ternärer Operator

Auch ein ternärer Operator
, der einer bedingten Anweisung ähnelt? :
entspricht if-else
Der ternäre Operator eignet sich besser für Situationen, in denen es um den Rückgabewert geht
Was bedeutet das?

var foo;;if(flag){
    foo = 1;
}else{
    foo = 2;
}
Nach dem Login kopieren

Es ist besser, es so umzuschreiben

var foo = flag ? 1 : 2;
Nach dem Login kopieren

Konzentrieren Sie sich auf den Rückgabewert von flag ? 1 : 2
Er wird direkt der foo-Variablen zugewiesen
Diese Situation eignet sich sehr gut für die Verwendung des ternären Operators


Das Obige betrifft Leistungsprobleme von bedingten Anweisungen in JavaScript
Obwohl wir selten eine große Anzahl von Bedingungen verwenden
und moderne Browser-JS-Engines auch sehr leistungsfähig sind (z. B. die V8-Engine [] ~( ̄▽ ̄)~*)
Aber es schadet nicht, etwas darüber zu wissen ...

Das Obige ist der Inhalt der Leistungsprobleme von JavaScript-bedingten Anweisungen. Weitere verwandte Inhalte Bitte beachten Sie die chinesische PHP-Website (www.php.cn)!


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)

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

Vue-Entwicklungshinweise: Vermeiden Sie häufige Speichernutzungs- und Leistungsprobleme Vue-Entwicklungshinweise: Vermeiden Sie häufige Speichernutzungs- und Leistungsprobleme Nov 22, 2023 pm 02:38 PM

Da Vue immer häufiger eingesetzt wird, müssen Vue-Entwickler auch darüber nachdenken, wie sie die Leistung und Speichernutzung von Vue-Anwendungen optimieren können. In diesem Artikel werden einige Vorsichtsmaßnahmen für die Vue-Entwicklung erläutert, um Entwicklern dabei zu helfen, häufige Speichernutzungs- und Leistungsprobleme zu vermeiden. Vermeiden Sie Endlosschleifen. Wenn eine Komponente kontinuierlich ihren eigenen Status aktualisiert oder eine Komponente kontinuierlich ihre eigenen untergeordneten Komponenten rendert, kann es zu einer Endlosschleife kommen. In diesem Fall geht Vue der Arbeitsspeicher aus und die Anwendung wird sehr langsam. Um diese Situation zu vermeiden, bietet Vue a

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

So verwenden Sie insertBefore in Javascript So verwenden Sie insertBefore in Javascript Nov 24, 2023 am 11:56 AM

Verwendung: In JavaScript wird die Methode insertBefore() verwendet, um einen neuen Knoten in den DOM-Baum einzufügen. Diese Methode erfordert zwei Parameter: den neuen Knoten, der eingefügt werden soll, und den Referenzknoten (d. h. den Knoten, an dem der neue Knoten eingefügt wird).

See all articles