¿Cómo verificar si un número está entre dos valores?

144

En JavaScript, le digo al navegador que haga algo si el tamaño de la ventana es superior a 500 px. Lo hago así:

if (windowsize > 500) {
    // do this
}

Esto funciona muy bien, pero me gustaría aplicar este mismo método, pero con un rango de números. Así que me gustaría decirle a mi navegador que haga cosas si el tamaño de la ventana está entre 500 px y 600 px. Sé que esto no funcionaría, pero así es como lo imaginé:

if (windowsize > 500-600) {
    // do this
}

¿Es esto posible en JavaScript?

Dyck
fuente
9
Parece un poco duro cerrar esta pregunta. ¿Puedo votar para volver a abrirlo? Está bien escrito y proporciona un código de muestra.
Caltor
Seguramente la comprobación más correcta sería if (windowsize> = 500 && windowsize <= 600) o if (! (Windowsize <500 || windowsize> 600))
SPlatten

Respuestas:

225

Comprueba si windowsizees mayor 500o menor que el 600significado de que ninguno de los valores 500o en 600sí mismo hará que la condición se vuelva verdadera.

if (windowsize > 500 && windowsize < 600) {
  // ...
}
indefinido
fuente
1
gracias indefinido, solo para confirmar que esto hará lo que quiero dentro del navegador cuando el tamaño de la ventana sea mayor que 500 px y menor que 600 px, esencialmente funcionando dentro del rango de 500-600 px solamente, ¿correcto? (No soy demasiado bueno con estas cosas jajaja)
Dyck
1
@Dyck Sí, lo hace :), tenga en cuenta que jQuery es solo una biblioteca de JavaScript.
indefinido
77
windowsizeTenga en cuenta que esta condición solo es cierta cuando es de al menos 501 px y como máximo 599 px. 500px y 600px están excluidos. Agregue igualdad a las comparaciones si desea incluir estos valores.
Robert Koritnik
3
Solo un detalle, pero es más legible de la siguiente manera:if(500 < windowsize && windowsize < 600)
Giovanni Benussi
119

Tuve un momento, así que, aunque ya has aceptado una respuesta, pensé que contribuiría lo siguiente:

Number.prototype.between = function(a, b) {
  var min = Math.min.apply(Math, [a, b]),
    max = Math.max.apply(Math, [a, b]);
  return this > min && this < max;
};

var windowSize = 550;

console.log(windowSize.between(500, 600));

Demostración de JS Fiddle .

O, si prefiere tener la opción de verificar que un número esté en el rango definido, incluidos los puntos finales :

Number.prototype.between = function(a, b, inclusive) {
  var min = Math.min.apply(Math, [a, b]),
    max = Math.max.apply(Math, [a, b]);
  return inclusive ? this >= min && this <= max : this > min && this < max;
};

var windowSize = 500;

console.log(windowSize.between(500, 603, true));

Demostración de JS Fiddle .

Editado para agregar una enmienda menor a lo anterior, dado que, como se señala en los comentarios,

... Function.prototype.apply()es lento! Además de llamarlo cuando tienes una cantidad fija de argumentos no tiene sentido ...

valió la pena eliminar el uso de Function.prototype.apply(), que produce las versiones modificadas de los métodos anteriores, en primer lugar sin la opción 'inclusiva':

Number.prototype.between = function(a, b) {
  var min = Math.min(a, b),
    max = Math.max(a, b);

  return this > min && this < max;
};

var windowSize = 550;

console.log(windowSize.between(500, 600));

Demostración de JS Fiddle .

Y con la opción 'inclusiva':

Number.prototype.between = function(a, b, inclusive) {
  var min = Math.min(a, b),
    max = Math.max(a, b);

  return inclusive ? this >= min && this <= max : this > min && this < max;
}

var windowSize = 500;

console.log(windowSize.between(500, 603, true));

Demostración de JS Fiddle .

Referencias

David dice reinstalar a Mónica
fuente
66
¿Por qué usar aplicar en lugar de llamar directamente como Main.min(a,b)? ¡Function.prototype.apply es lento! Además de llamarlo cuando tienes una cantidad fija de argumentos no tiene sentido.
Steel Brain
Voy a agregar esto a mi caja de herramientas predeterminada, ¡muy útil y gracias por esta contribución!
SidOfc
@SteelBrain: tienes un punto! He actualizado la respuesta para reflejar eso, aunque sospecho que tenía, inicialmente, una razón para usar Function.prototype.apply(), pero no puedo pensar qué era o podría haber sido.
David dice que reinstale a Mónica el
66
es MUCHO mejor crear una función que no modifique el Numberobjeto. Este es un antipatrón y lo morderá si los estándares de ECMA cambian para incluir una Number.between()función, o si otra biblioteca u otra pieza de código define en Number.prototype.betweenotro lugar con una definición diferente. En cambio, ¡haga una función auxiliar y úsela!
Monarca Wadia
2
@MonarchWadia Si bien su punto tiene sentido de que modificar / extender objetos nativos es una mala práctica, creo que es un poco redundante tener esto predicado en todas partes (sin ofender). No puedo contar las veces que he visto "no modificar objetos nativos". Para mí, esto es como alguien que vende cuchillos domésticos advirtiendo al comprador sobre los posibles peligros del cuchillo cada vez que vende uno como si fuera responsabilidad del vendedor si hay algún daño. Los peligros deben ser de conocimiento común. Debería depender del usuario si los ignora o no.
akinuri
80

Prefiero poner la variable en el interior para dar una pista adicional de que el código está validando mi variable está entre valores de rango

if (500 < size && size < 600) { doStuff(); }
David
fuente
13
¡Me gusta este estilo! adaptará eso :)
Kaii
2
Esta es mi preferencia, ya que está más cerca de la min < testval < maxsintaxis de
Python
@GouravChawla, ¿estás hablando del ejemplo de fragmento de código en esta respuesta? Mi fragmento de código era Python, usado para comparación
daveruinseverything
@GouravChawla nadie dijo lo contrario. No está claro con qué estás en desacuerdo.
daveruinseverything
28

Es una vieja pregunta, sin embargo, podría ser útil para alguien como yo.

lodashtiene la _.inRange()función https://lodash.com/docs/4.17.4#inRange

Ejemplo:

_.inRange(3, 2, 4);
// => true

Tenga en cuenta que este método utiliza la Lodashbiblioteca de utilidades y requiere acceso a una versión instalada de Lodash.

antongorodezkiy
fuente
2
Tenga en cuenta que el valor final no está incluido. p.ej. _.inRange(10, 0, 10) // => false
Lucio
Como el OP limitó el alcance de la pregunta Javascript, vale la pena señalar que este método utiliza la Lodashbiblioteca de utilidades y requiere acceso a una versión instalada de Lodash.
Chaya Cooper
2

Puede usar la cláusula múltiple en ifcondición en lugar de escribir

if (windowsize > 500-600) {
    // do this
}

porque esto realmente no tiene sentido lógicamente JavaScript leerá su condición si

windowSize > -100 

porque se calcula 500-600a-100

Debe usar &&para verificar estrictamente ambos casos, por ejemplo, que se verá así

if( windowSize > 500 && windowSize < 600 ){

// Then doo something

}
Hanzla Habib
fuente
0

Acabo de implementar este bit de jQuery para mostrar y ocultar los valores modales de arranque. Se muestran diferentes campos según el rango de valores de una entrada de cuadro de texto de los usuarios.

$(document).ready(function () {
    jQuery.noConflict();
    var Ammount = document.getElementById('Ammount');

    $("#addtocart").click(function () {

            if ($(Ammount).val() >= 250 && $(Ammount).val() <= 499) {
                {
                    $('#myModal').modal();
                    $("#myModalLabelbronze").show();
                    $("#myModalLabelsilver").hide();
                    $("#myModalLabelgold").hide();
                    $("#myModalPbronze").show();
                    $("#myModalPSilver").hide();
                    $("#myModalPGold").hide();
                }
            }
    });
Chico listo
fuente
66
Usando jQuery para las funciones triviales fue en 2013 tal vez una opción, pero no es hoy en día
mgamsjager
3
Es cierto, pero me temo que la gente aún utilizan hoy en día
mgamsjager
1
Por curiosidad: ¿por qué jQuery es peor para usar para funciones triviales ahora que entonces?
Julix
2
@Julix principalmente rendimiento, aunque insignificante en este caso. El punto general sería "no use jQuery cuando no sea necesario", pero estos comentarios no son el lugar para (re) iniciar el debate. diviértete con esto :) i.stack.imgur.com/sGhaO.gif
Luca
Esto es solo una implementación de la solución. OP ya tiene acceso a los valores. Entonces jQuery $().val()es irrelevante y no es necesario. Pero nuevamente, en la versión original de la pregunta, OP menciona jQuery, para una simple comprobación aritmética. (suspiro) Ese es el primer error.
akinuri
0

Aquí está el método más corto posible:

if (Math.abs(v-550)<50) console.log('short')
if ((v-500)*(v-600)<0) console.log('short')

Parametrizado:

if (Math.abs(v-max+v-min)<max+min) console.log('short')
if ((v-min)*(v-max)<0) console.log('short')

Puedes dividir ambos lados entre 2 si no entiendes cómo funciona el primero;)

yukashima huksay
fuente