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
Write a number array and using for loop add only even numbers in javascript?
In JavaScript, you can iterate through a number array and add only the even numbers using various loop methods. An even number is any integer that is divisible by 2, meaning when divided by 2, the remainder is 0.
What are Even Numbers?
Even numbers are integers that can be divided by 2 without leaving a remainder. We can check this using the modulo operator (%):
if(number % 2 == 0) {
// Number is even
}
Using for Loop
The for loop is the most common way to iterate through an array and process even numbers. Here's how to find and sum even numbers:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Sum of Even Numbers</title>
</head>
<body>
<script>
var arr = [1,2,3,4,5,6,7,8,9,10,12];
var sum = 0;
document.write("Even numbers in array: ");
for(let i = 0; i < arr.length; i++) {
if(arr[i] % 2 == 0) {
sum = sum + arr[i];
document.write(arr[i] + " ");
}
}
document.write("<br>Sum of even numbers = " + sum);
</script>
</body>
</html>
Even numbers in array: 2 4 6 8 10 12 Sum of even numbers = 42
Using while Loop
The while loop provides an alternative approach to iterate through the array elements:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Sum of Even Numbers</title>
</head>
<body>
<script>
var arr = [1,2,3,4,5,20,7,8,9,10,12];
var e_sum = 0;
let i = 0;
document.write("Even numbers in array: ");
while(i < arr.length) {
if(arr[i] % 2 == 0) {
e_sum = e_sum + arr[i];
document.write(arr[i] + " ");
}
i++;
}
document.write("<br>Sum of even numbers = " + e_sum);
</script>
</body>
</html>
Even numbers in array: 2 4 20 8 10 12 Sum of even numbers = 56
Using map() Method
The map() method creates a new array by calling a function for each array element. While not typically used for filtering, it can process even numbers:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Sum of Even Numbers</title>
</head>
<body>
<script>
var arr = [1,2,3,4,5,6,7,8,9,10];
var sum = 0;
document.write("Array even elements: ");
arr.map(function(ele) {
if(ele % 2 == 0) {
document.write(ele + " ");
sum = sum + ele;
}
});
document.write("<br>Sum of even elements = " + sum);
</script>
</body>
</html>
Array even elements: 2 4 6 8 10 Sum of even elements = 30
Using forEach() Loop
The forEach() method executes a function for each array element. Unlike map(), it doesn't return a new array:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Sum of Even Numbers</title>
</head>
<body>
<script>
var arr = [2,3,4,20,6,7,8,9,10];
var sum = 0;
document.write("Even numbers in array: ");
arr.forEach(function(ele) {
if(ele % 2 == 0) {
document.write(ele + " ");
sum += ele;
}
});
document.write("<br>Sum of even numbers = " + sum);
</script>
</body>
</html>
Even numbers in array: 2 4 20 6 8 10 Sum of even numbers = 50
Comparison of Methods
| Method | Best For | Returns Value |
|---|---|---|
| for loop | Basic iteration with full control | No (manual processing) |
| while loop | Conditional iteration | No (manual processing) |
| map() | Creating new arrays | New array |
| forEach() | Simple iteration without return | undefined |
Conclusion
All methods effectively identify and sum even numbers from an array. The for loop offers the most control, while forEach() provides cleaner syntax for simple operations. Choose based on your specific requirements and coding style preferences.
2K+ Views
