¿Cuál es la forma más elegante de limitar un número a un segmento?

Digamos x, ay bson números. Necesito limitarme xa los límites del segmento [a, b].

Puedo escribir Math.max(a, Math.min(x, b)), pero no creo que sea muy fácil de leer. ¿Alguien tiene una manera inteligente de escribir esto de una manera más legible?

La forma en que lo haces es bastante estándar. Puede definir una clampfunción de utilidad :

/**
 * Returns a number whose value is limited to the given range.
 *
 * Example: limit the output of this computation to between 0 and 255
 * (x * 255).clamp(0, 255)
 *
 * @param {Number} min The lower boundary of the output range
 * @param {Number} max The upper boundary of the output range
 * @returns A number in the range [min, max]
 * @type Number
 */
Number.prototype.clamp = function(min, max) {
  return Math.min(Math.max(this, min), max);
};

(Aunque la ampliación de las funciones de lenguaje generalmente está mal vista)

un enfoque menos orientado a "Matemáticas", pero también debería funcionar, de esta manera, la prueba </> está expuesta (quizás más comprensible que el minimaxing) pero realmente depende de lo que quiere decir con "legible"

function clamp(num, min, max) {
  return num <= min ? min : num >= max ? max : num;
}

Actualización para ECMAScript 2017:

Math.clamp(x, lower, upper)

Pero tenga en cuenta que a partir de hoy, es una propuesta de Etapa 1 . Hasta que sea ampliamente compatible, puede usar un polyfill .

Math.clip = function(number, min, max) {
  return Math.max(min, Math.min(number, max));
}

Esto no quiere ser una respuesta "solo use una biblioteca", pero en caso de que esté usando Lodash, puede usar .clamp:

_.clamp(yourInput, lowerBound, upperBound);

Así que eso:

_.clamp(22, -10, 10); // => 10

Aquí está su implementación, tomada de la fuente de Lodash :

/**
 * The base implementation of `_.clamp` which doesn't coerce arguments.
 *
 * @private
 * @param {number} number The number to clamp.
 * @param {number} [lower] The lower bound.
 * @param {number} upper The upper bound.
 * @returns {number} Returns the clamped number.
 */
function baseClamp(number, lower, upper) {
  if (number === number) {
    if (upper !== undefined) {
      number = number <= upper ? number : upper;
    }
    if (lower !== undefined) {
      number = number >= lower ? number : lower;
    }
  }
  return number;
}

Además, vale la pena señalar que Lodash pone a disposición métodos individuales como módulos independientes, por lo que en caso de que solo necesite este método, puede instalarlo sin el resto de la biblioteca:

npm i --save lodash.clamp

Si puede usar las funciones de flecha es6, también puede usar un enfoque de aplicación parcial:

const clamp = (min, max) => (value) =>
    value < min ? min : value > max ? max : value;

clamp(2, 9)(8); // 8
clamp(2, 9)(1); // 2
clamp(2, 9)(10); // 9

or

const clamp2to9 = clamp(2, 9);
clamp2to9(8); // 8
clamp2to9(1); // 2
clamp2to9(10); // 9

Si no desea definir ninguna función, escribirla como si Math.min(Math.max(x, a), b)no fuera tan malo.

En el espíritu de la sensualidad de la flecha, puede crear una micro abrazadera / restricción / puerta / & c. función utilizando parámetros de descanso

var clamp = (...v) => v.sort((a,b) => a-b)[1];

Luego solo pasa tres valores

clamp(100,-3,someVar);

Es decir, de nuevo, si por sexy, te refieres a 'corto'

Esto expande la opción ternaria en if / else que minified es equivalente a la opción ternary pero no sacrifica la legibilidad.

const clamp = (value, min, max) => {
  if (value < min) return min;
  if (value > max) return max;
  return value;
}

Se reduce a 35b (o 43b si se usa function):

const clamp=(c,a,l)=>c<a?a:c>l?l:c;

Además, dependiendo de qué herramienta de rendimiento o navegador utilice, obtendrá varios resultados de si la implementación basada en matemáticas o la implementación basada en ternario es más rápida. En el caso de aproximadamente el mismo rendimiento, optaría por la legibilidad.

Mi favorito:

[min,x,max].sort()[1]