How to get the smallest of zero or more numbers in JavaScript?

Javascript Web Development Front End Technology

In this tutorial, we shall learn to find the smallest among numbers in JavaScript.

Let’s discuss the available methods one after the other

Using the Math.min() Method

Here, the Math.min() is a static function of the placeholder object Math. If no parameters, the result is -Infinity. If the parameters are numbers, the result is the smallest among them. If any one of the parameters is not a number, the method returns NaN. This is an ECMAScript1 feature.

Syntax

Following is the syntax of Math.min() method −

Math.min(a1, a2,…a_n)

Here, we need to give numbers as parameters.

Parameters

a1, a2,…a_n − the numbers.

Example

Here, Math.min() directly finds the smallest value.


<html>
<body>
   <h3>The smallest among numbers <i>using the Math.min()</i></h3>
   <p id="firstId"></p>
   <script>
      var m1 = Math.min(0, -7, 20, 0.8);
      document.getElementById("firstId").innerHTML = "The smallest " + m1;
   </script>
</body>
</html>

Using Array.min() and Math.min().apply()

Here, an array of numbers is the input. The Math.min() applies this array and gives us the smallest number.

Syntax

Following is the syntax to use Array.min() method and Array.min.apply() −

Array.min = function(array)
{
   return Math.min.apply(Math, array);
};
var minimum = Array.min(arr);

Here, an array of numbers has to be given as the input.

Parameters

arr − The array.

Example

Here, Array.min() takes the input array and Math.min() applies it and returns the output.


<html>
<body>
   <h3>The smallest among numbers using the Math.min.apply() and Array.min()</h3>
   <p id="result"></p>
   <script>
      Array.min = function(array) {
         return Math.min.apply(Math, array);
      };
      var array = [24, 2, 1, 0];
      var minimum = Array.min(array);
      document.getElementById("result").innerHTML = "The smallest : " + minimum;
   </script>
</body>
</html>

Using the Destructuring Assignment Syntax/Spread Operator

Using the spread operator … we can extract values from an array or object into different variables. We can use this method because the Math.min() method does not support a direct array as an input.

Syntax

Users can follow the syntax below.

Math.min(...[p, q, r]);

Here, the spread operator helps the Math.min() method to return the smallest value.

Parameters

p, q, r − The array of numbers

Example

Here, Math.min() with the spread operator directly evaluates our input and displays the output.


<html>
<body>
   <h3>The smallest among numbers using the spread operator</h3>
   <div id="result"></div>
   <script>
      var res = Math.min(...[21, 2, 3, -2, 0, -23]);
      document.getElementById("result").innerHTML = res;
   </script>
</body>
</html>

Using the for Loop

As we know, here we consider the first number in an array as the smallest. Then we compare the remaining numbers in the array with this. Finally, we get the smallest value.

Syntax

Users can follow the syntax below.

for (var i = 0; i<arr.length; i++)
{
   if (arr[i] < arr[0])
   {
      //arr[i] is the smallest
   }
}

Here, the for loop evaluates the array of numbers and compares all with the first number and returns the smallest.

Parameters

arr − The array
i − The array index

Example

Here, the general array elements compare logic in the loop, and the output is displayed.


<html>
<body>
   <h3>The smallest among numbers using the loop</h3>
   <p id="result"></p>
   <script>
      const numbers = [11, 4, 9, 0, 2];
      let min = numbers[0];
      for (let i = 0; i < numbers.length; i++) {
         if (numbers[i] < min) {
            min = numbers[i];
         }
      }
      document.getElementById("result").innerHTML = "The smallest is " + min;
   </script>
</body>
</html>

Using the Array.reduce() Method

Here, we give the input to a call-back function. This function iterates through the input and gives the smallest value.

Syntax

numsArr.reduce((r1, r2) => Math.min(r1, r2))

Here, two values are compared every time of an array iteration and the smallest value is returned at the end.

Parameters

r1, r2 − r1 is the accumulator, and r2 is the current value respectively. During array iteration, if the current value becomes smaller than the accumulator, the current value becomes the next accumulator.

Example

Here, our input is processed by reduce(), and Math.min() returns the result.


<html>
<body>
   <h3>The smallest among numbers using <i>Array.reduce()</i> Method</h3>
   <p id="numb"></p>
   <p id="result"></p>
   <script>
      const nums = [6, 7, 0.3];
      document.getElementById("numb").innerHTML = nums;
      const res = nums.reduce((a, b) => Math.min(a, b))
      document.getElementById("result").innerHTML = "The smallest is " + res;
   </script>
 </body>
</html>

Using the Array.sort() Method

In the Array sort method, we get the minimum value at the start of the array.

Syntax

arr.sort()[0]

Here, arr is the array of numbers.

Example

Here, the JavaScript sort is done on the input array and the first value is returned.


<html>
<body>
   <h3>The smallest among numbers using <i>Array sort</i> method</h3>
   <p id="numb"></p>
   <p id="result"></p>
   <script>
      const srtArr = [60, 10, 80];
      document.getElementById("numb").innerHTML = srtArr
      const res = srtArr.sort()[0]
      document.getElementById("result").innerHTML = "Smallest is " + res;
   </script>
</body>
</html>