Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
How to find the largest number contained in a JavaScript array?
In this tutorial, we will learn about the different methods to find the largest number contained inside a JavaScript array. An array is a collection of different values, and we need efficient ways to identify the maximum value.
There are three main approaches to find the largest number in a JavaScript array:
- Traversing the Whole Array
- Using the reduce() Method
- Using the Math.max() and apply() methods
Using Array Traversal (For Loop)
This is the most straightforward approach where we iterate through each element and compare it with the current largest value.
Algorithm Steps
- Step 1 ? Initialize a variable with the first array element
- Step 2 ? Loop through remaining elements starting from index 1
- Step 3 ? Compare each element with the current largest
- Step 4 ? Update the largest value when a bigger element is found
Example
<html>
<body>
<h3>Finding the largest number contained in a JavaScript array</h3>
<p>The Dummy array is: [5, 10, 20, 3, 98, 95]</p>
<p id="result"></p>
<script>
let arr = [5, 10, 20, 3, 98, 95];
let largest = arr[0];
function largestNumber() {
for (let i = 1; i < arr.length; i++) {
if (arr[i] > largest)
largest = arr[i];
}
document.getElementById('result').innerHTML = "The largest element of the array is: " + largest;
}
largestNumber();
</script>
</body>
</html>
The largest element of the array is: 98
Using the reduce() Method
The reduce() method executes a reducer function on each array element and returns a single value. It's perfect for finding the maximum value without modifying the original array.
Example
<html>
<body>
<h3>Finding the largest number contained in a JavaScript array</h3>
<p>The Dummy array is: [20, 22, 18, 25, 75, 62, 88]</p>
<p id="result"></p>
<script>
let arr = [20, 22, 18, 25, 75, 62, 88];
let largest = arr.reduce(function (a, b) {
return (a > b) ? a : b;
}
);
document.getElementById('result').innerHTML = "The largest element using reduce() method is: " + largest;
</script>
</body>
</html>
The largest element using reduce() method is: 88
Using Math.max() with apply() Method
The Math.max() method finds the largest value among numbers, but it doesn't work directly with arrays. We use apply() to make it work with array elements.
Why Math.max() alone doesn't work with arrays:
// This works console.log(Math.max(8, 2, 3, 9)); // Returns 9 // This doesn't work var array = [6, 23, 9, 5]; console.log(Math.max(array)); // Returns NaN
Solution using apply():
var array = [6, 23, 9, 5]; console.log(Math.max.apply(null, array)); // Returns 23
Example
<html>
<body>
<h3>Find the largest number contained in a JavaScript array</h3>
<p>The Dummy array is: [44, 28, 18, 55, 68, 11, 70]</p>
<p id="result"></p>
<script>
let arr = [44, 28, 18, 55, 68, 11, 70];
let largest = Math.max.apply(null, arr);
document.getElementById('result').innerHTML = "The largest element using Math.max() and apply() method is: " + largest;
</script>
</body>
</html>
The largest element using Math.max() and apply() method is: 70
Modern Alternative: Spread Operator
In modern JavaScript (ES6+), you can use the spread operator with Math.max() for cleaner syntax:
let arr = [44, 28, 18, 55, 68, 11, 70]; let largest = Math.max(...arr); console.log(largest); // 70
Comparison
| Method | Performance | Readability | Browser Support |
|---|---|---|---|
| For Loop | Excellent | Good | All browsers |
| reduce() | Good | Excellent | ES5+ (IE9+) |
| Math.max.apply() | Good | Good | All browsers |
| Math.max(...array) | Good | Excellent | ES6+ (Modern) |
Conclusion
All three methods effectively find the largest number in an array. Use the for loop for maximum performance, reduce() for functional programming style, or Math.max() with apply() for concise code. Modern browsers support the spread operator syntax for even cleaner implementation.
12K+ Views
