Maison  >  Article  >  interface Web  >  Problèmes de performances avec les instructions conditionnelles JavaScript

Problèmes de performances avec les instructions conditionnelles JavaScript

黄舟
黄舟original
2017-02-28 14:48:191021parcourir

Instructions conditionnelles

Comme les boucles, les instructions conditionnelles modifieront également le flux en cours
Il existe deux types d'instructions conditionnelles en JavaScript

  • if-else

  • commutateur

if-else est notre plus couramment utilisé
Mais si - L'instruction else et l'instruction switch peuvent être remplacées l'une par l'autre dans de nombreux cas
Par exemple, le code suivant est équivalent

if(foo){    ...}else{    ...}
switch(foo){
    case true:        ...
    default:        ...}

Quand il y a peu de conditions, les gens sont plus susceptibles utiliser if-else
Mais la condition Plusieurs commutateurs semblent plus faciles à comprendre

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

Mais laquelle des deux instructions conditionnelles que nous utilisons a les meilleures performances
Si le nombre de conditions est très grande, l'instruction switch s'exécutera Plus rapidement et de manière plus évidente
Pour être précis : lorsque les conditions augmentent, la charge de performance if-else augmente dans une plus grande mesure
(la plupart des instructions de changement de langage utilisent des index de table de branchement de table de branchement pour optimiser)
Et en JavaScript, la conversion de type forcée ne se produira pas dans l'instruction switch
C'est-à-dire que l'opérateur de congruence est utilisé pour la comparaison
De cette façon, il n'y aura pas de perte de conversion de type

Nous utilisons donc if- lorsque le nombre de conditions est petit, sinon, lorsqu'il y a de nombreuses conditions, il est raisonnable d'utiliser switch
du point de vue des performances
(if-else convient pour juger deux valeurs discrètes ​​ou plusieurs plages de valeurs différentes, switch convient pour juger plusieurs valeurs discrètes)


Lorsque nous utilisons des instructions if-else, nous devons les organiser dans l'ordre des probabilités grandes à petites
C'est facile à comprendre, mais nous l'ignorons facilement
Un autre point d'optimisation est d'essayer de faire en sorte que le if -else soit organisé en une série d'instructions if-else imbriquées
Ceci est similaire à notre dichotomie mathématique, qui peut réduire la portée et le temps d'exécution
Comme ça

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

Changer pour ceci

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

Peut améliorer l'efficacité

Table de recherche

Dans certains Dans des cas particuliers, l'utilisation de la méthode "table de recherche" a des performances très élevées, lorsqu'il y a un grand nombre de conditions Suivant

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;
    }
}

Restructurer la fonction ci-dessus en ceci

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

Ceci est non seulement concis et lisible, mais offre également de meilleures performances
Lorsque le nombre de conditions augmente, la table de recherche ne produira presque aucune surcharge de performances supplémentaire
Mais elle est plus adaptée aux situations où il existe une correspondance logique entre un une seule clé et une seule valeur

Opérateur ternaire

Aussi Un opérateur ternaire
qui est similaire à une instruction conditionnelle ? :
est équivalent à if-else
L'opérateur ternaire est plus adapté aux situations où la valeur de retour est concernée
Qu'est-ce que cela signifie ?

var foo;;if(flag){
    foo = 1;
}else{
    foo = 2;
}

Il vaut mieux le réécrire comme ça

var foo = flag ? 1 : 2;

Concentrez-vous sur la valeur de retour de flag ? 1 : 2
Elle est directement affectée à la variable foo
Cette situation est très adaptée à l'utilisation de l'opérateur ternaire


Ce qui précède concerne les problèmes de performances des instructions conditionnelles en JavaScript
Bien que nous utilisions rarement un grand nombre de conditions
et que les moteurs js des navigateurs modernes soient également très puissants (comme le moteur V8 [] ~( ̄▽ ̄)~*)
Mais cela ne fait pas de mal d'en savoir quelque chose...

Ce qui précède est le contenu des problèmes de performances des instructions conditionnelles JavaScript Pour plus de contenu connexe. , veuillez faire attention au site Web PHP chinois (www.php.cn) !


Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn