Question

我想限制两个值之间的数字，我知道在PHP中你可以这样做：

$number = min(max(intval($number), 1), 20);
// this will make $number 1 if it's lower than 1, and 20 if it's higher than 20

如何在javascript中执行此操作，而不必编写多个if语句和类似的东西？感谢。

Answer 1

像这样

var number = Math.min(Math.max(parseInt(number), 1), 20);

Answer 2

您至少有两个选择：

您可以使用一对条件运算符（? :）：

number = number > 100 ? 100 : number < 0 ? 0 : number;

或者您可以合并Math.max和Math.min：

number = Math.min(100, Math.max(0, number));

在这两种情况下，相对容易混淆自己，所以如果你在多个地方这样做，你可能会考虑使用实用功能：

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

然后：

number = clamp(number, 0, 100);

Answer 3

使用lodash的clamp方法：

_.clamp(22, 1, 20) // Outputs 20

Answer 4

使用Math.min和Math.max。

Answer 5

无需进一步说明：

function clamp(value, min, max) {
    return Math.min(Math.max(value, min), max);
}

Answer 6

相关：What's the most elegant way to cap a number to a segment?：

ECMAScript 2017更新：

Math.clamp(x, lower, upper)

但是请注意，截止到今天，这是第1阶段proposal。在得到广泛支持之前，您可以使用polyfill。

Answer 7

我将共享强大的功能来强制执行整数（由于integer标签），它具有诸如可选的最小/最大参数和-0保护之类的功能：< / p>

function toInt(val, min, max){
    val=(val*1 || 0);
    val=(val<0 ? Math.ceil(val) : Math.floor(val));

    min*=1;
    max*=1;

    min=((Number.isNaN(min) ? -Infinity : min) || 0);
    max=((Number.isNaN(max) ? Infinity : max) || 0);

    return Math.min(Math.max(val, min), max);
}

一些简要说明：

幕后的(... || 0)正在处理-0，将其更改为0，这几乎总是您想要的。
min和max参数是可选的。传递空白或无效值后，它们将变成-Infinity和Infinity，因此它们会静默地不会干扰Math.min()和Math.max()。
您可以将Number.isNaN(x) ECMAScript-6更改为x!==x（仅对NaN为真），以便与确实旧版浏览器兼容，但这是完全没有必要了。

如何使用JavaScript限制最小/最大值之间的数字？

7 个答案: