Javascript cambiar vs. if ... else if ... else

Chicos, tengo un par de preguntas:

1. ¿Hay una diferencia de rendimiento en JavaScript entre una switchdeclaración y una if...else?
2. Si es así, ¿por qué?
3. Es el comportamiento de switchy if...elsediferentes a través de los navegadores? (Firefox, IE, Chrome, Opera, Safari)

La razón para hacer esta pregunta es que parece que obtengo un mejor rendimiento en una switchdeclaración con aproximadamente 1000 casos en Firefox.

Editado Desafortunadamente este no es mi código, el Javascript se está produciendo en el servidor desde una biblioteca compilada y no tengo acceso al código. El método que produce el javascript se llama

CreateConditionals(string name, string arrayofvalues, string arrayofActions)

note arrayofvalueses una lista separada por comas.

lo que produce es

function [name] (value) {
  if (value == [value from array index x]) {
     [action from array index x]
  }
}

Nota: where [name]= el nombre pasado a la función del servidor

Ahora cambié la salida de la función para insertarla en un TextArea, escribí un código JavaScript para analizar la función y la convertí en un conjunto de casedeclaraciones.

Finalmente ejecuto la función y funciona bien, pero el rendimiento difiere en IE y Firefox.

Respondiendo en generalidades:

1. Si, por lo general.
2. Ver más información aquí
3. Sí, debido a que cada uno tiene un motor de procesamiento JS diferente, sin embargo, al ejecutar una prueba en el sitio a continuación, el conmutador siempre realizó el if, elseif en un gran número de iteraciones.

Sitio de prueba

A veces es mejor no usar ninguno. Por ejemplo, en una situación de "despacho", Javascript le permite hacer las cosas de una manera completamente diferente:

function dispatch(funCode) {
  var map = {
    'explode': function() {
      prepExplosive();
      if (flammable()) issueWarning();
      doExplode();
    },

    'hibernate': function() {
      if (status() == 'sleeping') return;
      // ... I can't keep making this stuff up
    },
    // ...
  };

  var thisFun = map[funCode];
  if (thisFun) thisFun();
}

La configuración de la ramificación multidireccional mediante la creación de un objeto tiene muchas ventajas. Puede agregar y eliminar funcionalidades dinámicamente. Puede crear la tabla de despacho a partir de datos. Puedes examinarlo mediante programación. Puede construir los manejadores con otras funciones.

Existe la sobrecarga adicional de una llamada de función para llegar al equivalente de un "caso", pero la ventaja (cuando hay muchos casos) de una búsqueda hash para encontrar la función para una tecla en particular.

La diferencia de rendimiento entre una switchy if...else if...elsees pequeña, que, básicamente, hacer el mismo trabajo. Una diferencia entre ellos que puede marcar la diferencia es que la expresión a probar solo se evalúa de vez en switchcuando, se evalúa para cada uno if. Si es costoso evaluar la expresión, hacerlo una vez es, por supuesto, más rápido que hacerlo cien veces.

La diferencia en la implementación de esos comandos (y todos los scripts en general) difiere bastante entre los navegadores. Es común ver diferencias de rendimiento bastante grandes para el mismo código en diferentes navegadores.

Como difícilmente puede probar el rendimiento de todo el código en todos los navegadores, debe buscar el código que mejor se adapte a lo que está haciendo e intentar reducir la cantidad de trabajo realizado en lugar de optimizar cómo se hace.

1. Si hay una diferencia, nunca será lo suficientemente grande como para ser notada.
2. N / A
3. No, todos funcionan de manera idéntica.

Básicamente, use lo que haga que el código sea más legible. Definitivamente, hay lugares donde una u otra construcción hace que sea más limpio, más legible y más fácil de mantener. Esto es mucho más importante que quizás guardar algunos nanosegundos en el código JavaScript.

Además de la sintaxis, se puede implementar un interruptor utilizando un árbol que lo hace O(log n), mientras que un if / else debe implementarse con un O(n)enfoque de procedimiento. Más a menudo, ambos se procesan procesalmente y la única diferencia es la sintaxis, y además, ¿realmente importa, a menos que esté escribiendo estáticamente 10k casos de if / else de todos modos?

La respuesta de Pointy sugiere el uso de un objeto literal como alternativa a switcho if/ else. También me gusta este enfoque, pero el código en la respuesta crea un nuevo mapobjeto cada vez dispatchque se llama a la función:

function dispatch(funCode) {
  var map = {
    'explode': function() {
      prepExplosive();
      if (flammable()) issueWarning();
      doExplode();
    },

    'hibernate': function() {
      if (status() == 'sleeping') return;
      // ... I can't keep making this stuff up
    },
    // ...
  };

  var thisFun = map[funCode];
  if (thisFun) thisFun();
}

Si mapcontiene una gran cantidad de entradas, esto puede generar una sobrecarga significativa. Es mejor configurar el mapa de acción solo una vez y luego usar el mapa ya creado cada vez, por ejemplo:

var actions = {
    'explode': function() {
        prepExplosive();
        if( flammable() ) issueWarning();
        doExplode();
    },

    'hibernate': function() {
        if( status() == 'sleeping' ) return;
        // ... I can't keep making this stuff up
    },
    // ...
};

function dispatch( name ) {
    var action = actions[name];
    if( action ) action();
}

¿Hay una diferencia de rendimiento en Javascript entre una instrucción switch y un if ... else if .... else?

No lo creo, switches útil / breve si quieres prevenir múltiples if-elseafecciones.

¿Es el comportamiento del interruptor y si ... más si ... más es diferente en los navegadores? (Firefox, IE, Chrome, Opera, Safari)

El comportamiento es el mismo en todos los navegadores :)

1. Workbenching puede resultar en algunas diferencias muy pequeñas en algunos casos, pero la forma de procesamiento depende del navegador de todos modos, por lo que no vale la pena molestarse
2. Debido a diferentes formas de procesamiento
3. No puede llamarlo un navegador si el comportamiento sería diferente de todos modos

Resulta que si, si no, generalmente es más rápido que cambiar

http://jsperf.com/switch-if-else/46