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
Selected Reading
Finding the mid of an array in JavaScript
Finding the middle element of an array is a common programming task in JavaScript. The approach differs depending on whether the array has an odd or even number of elements.
Array Basics
An Array in JavaScript is a data structure used to store multiple elements. These elements are stored at contiguous memory locations and accessed using index numbers starting from 0.
Syntax
const array_name = [item1, item2, ...];
Example of array declaration:
const body = ['Eyes', 'Nose', 'Lips', 'Ears'];
Understanding Middle Element Logic
Finding the middle element depends on the array length:
-
Odd length: One middle element at index
(length - 1) / 2 -
Even length: Two middle elements at indices
length/2 - 1andlength/2
Input/Output Examples
Input (odd): [1, 3, 7, 10, 17, 18, 33, 45, 99] Output: 17 Input (even): [1, 3, 7, 10, 17, 18, 33, 45] Output: 10, 17
Method 1: Using Length Property (Simple Approach)
<!DOCTYPE html>
<html>
<head>
<title>Finding Middle Element - Odd Array</title>
</head>
<body>
<button onclick="findMiddle()">Find Middle Element</button>
<p id="result"></p>
<script>
function findMiddle() {
const array = [1, 3, 7, 10, 17, 18, 33, 45, 99];
const length = array.length;
let middle;
if (length % 2 === 1) {
// Odd length - one middle element
middle = array[Math.floor(length / 2)];
document.getElementById("result").innerHTML =
"Array: [" + array + "]<br>Middle element: " + middle;
}
}
</script>
</body>
</html>
Method 2: Handling Both Odd and Even Arrays
<!DOCTYPE html>
<html>
<head>
<title>Finding Middle Element - Any Array</title>
</head>
<body>
<button onclick="findMiddleElements()">Find Middle Element(s)</button>
<p id="output"></p>
<script>
function findMiddleElements() {
const evenArray = [1, 3, 7, 10, 17, 18, 33, 45];
const oddArray = [1, 3, 7, 10, 17, 18, 33, 45, 99];
function getMiddle(arr) {
const length = arr.length;
if (length % 2 === 1) {
// Odd length - return single middle element
return [arr[Math.floor(length / 2)]];
} else {
// Even length - return two middle elements
return [arr[length / 2 - 1], arr[length / 2]];
}
}
const evenResult = getMiddle(evenArray);
const oddResult = getMiddle(oddArray);
document.getElementById("output").innerHTML =
"Even array [" + evenArray + "] middle: " + evenResult.join(", ") +
"<br>Odd array [" + oddArray + "] middle: " + oddResult.join(", ");
}
</script>
</body>
</html>
Method 3: Interactive Example with String Array
<!DOCTYPE html>
<html>
<head>
<title>Middle Element of String Array</title>
<style>
.button {
background-color: MediumSeaGreen;
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 2px 2px;
cursor: pointer;
}
</style>
</head>
<body>
<div>
<button class="button" onclick="showMiddle()">Find Middle of Movie Array</button>
<p id="demo">Click the button to get the middle element of the movie array</p>
</div>
<script>
function showMiddle() {
const movies = ['RRR', 'KGF', 'Bahubali', 'Pushpa', 'Dangal'];
const middleIndex = Math.floor((movies.length - 1) / 2);
const middleElement = movies[middleIndex];
document.getElementById("demo").innerHTML =
"Array: [" + movies.join(", ") + "]<br>" +
"Middle element: " + middleElement + " (at index " + middleIndex + ")";
}
</script>
</body>
</html>
Comparison of Approaches
| Method | For Odd Arrays | For Even Arrays | Best Use Case |
|---|---|---|---|
Math.floor(length / 2) |
Returns single middle | Returns second of two middles | When you need one element only |
(length - 1) / 2 |
Returns single middle | Returns fractional index | Only for odd-length arrays |
| Conditional approach | Returns single middle | Returns both middles | When you need proper handling of both cases |
Conclusion
Finding the middle element of an array requires checking if the array length is odd or even. Use Math.floor(length / 2) for a single middle element, or implement conditional logic to handle both odd and even arrays appropriately.
Updated on: 2026-03-15T23:19:00+05:30
3K+ Views
Advertisements