- Home
- /
- Tutorials
- /
- JavaScript Tutorial
- /
- JavaScript Math.min and Math.max
JavaScript Numbers & Math
JavaScript Math.min and Math.max
Math.minandMath.maxfind the smallest and largest of the values you give them.
They take separate arguments, not an array.
Spread is what bridges that gap.
Example
Example
javascript
console.log(Math.min(5, 2, 9));
console.log(Math.max(5, 2, 9));The output is 2 then 9.
How They Work
Both accept any number of arguments.
An array must be spread with three dots.
With no arguments, min gives Infinity and max gives -Infinity.
Syntax
Syntax
javascript
Math.max(a, b, c);
Math.max(...array);Passing an array directly gives NaN.
Using an Array
Spreading turns the array into separate arguments.
Example
Example
javascript
const scores = [45, 82, 30, 91];
console.log(Math.max(...scores));
console.log(Math.min(...scores));The output is 91 then 30.
Passing the Array Directly Fails
The array becomes a single argument, which cannot be compared.
Example
Example
javascript
const scores = [45, 82, 30];
console.log(Math.max(scores));
console.log(Math.max(...scores));The first gives NaN.
Clamping a Value
Combining both keeps a number inside a range.
This is used constantly for things like volume or progress.
Example
Example
javascript
function clamp(value, min, max) {
return Math.min(Math.max(value, min), max);
}
console.log(clamp(150, 0, 100));
console.log(clamp(-20, 0, 100));
console.log(clamp(50, 0, 100));The output is 100, 0, 50.
Empty Arrays
Spreading an empty array passes no arguments at all.
Math.max then returns -Infinity and Math.min returns Infinity, which is rarely what you want.
Example
Example
javascript
const empty = [];
console.log(Math.max(...empty));
console.log(empty.length === 0 ? "check first" : Math.max(...empty));Guard against an empty array before using it.
Very Large Arrays
Spreading a huge array can exceed the argument limit.
reduce is safe at any size.
Example
Example
javascript
const numbers = [45, 82, 30, 91];
const largest = numbers.reduce(function (big, n) {
return n > big ? n : big;
}, numbers[0]);
console.log(largest);For a few thousand values, spread is fine.
Complete Example
Complete Example
html
<!DOCTYPE html>
<html>
<head>
<title>JavaScript Math.min and Math.max</title>
</head>
<body>
<h1>Math.min and Math.max</h1>
<p id="out"></p>
<script>
const scores = [45, 82, 30, 91, 67];
function clamp(value, min, max) {
return Math.min(Math.max(value, min), max);
}
document.getElementById("out").innerHTML =
"Highest: " + Math.max(...scores) +
"<br>Lowest: " + Math.min(...scores) +
"<br>Clamped 150 to 0-100: " + clamp(150, 0, 100);
</script>
</body>
</html>Try It Yourself
Run the above example in the Try It Editor.
Try without spread:
Remove the three dots and watch NaN appear.
Important Points
- Both take separate arguments, not an array.
- Spread the array with three dots.
- Passing an array directly gives
NaN. - Combining both clamps a value into a range.
- An empty array gives -Infinity from
max, so guard it.
Conclusion
The spread requirement is the thing to remember here.
Clamping is a small function worth keeping around.
For very large arrays, reduce is the safer choice.
