I have an long list of number array and I want to loop through the array by 4 elements at a time
[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
I want to loop through them so I can work with 1-4
, 5-8
, 9-12
like that
How to Loop Through an Array with a forEach Loop in JavaScript. The array method forEach() loop's through any array, executing a provided function once for each array element in ascending index order. This function is known as a callback function.
Use the forEach() method to iterate over the elements in a Set . The forEach method takes a function that gets invoked once for each value in the Set object. The forEach method returns undefined .
Iterating over an array You can iterate over an array using for loop or forEach loop. Using the for loop − Instead on printing element by element, you can iterate the index using for loop starting from 0 to length of the array (ArrayName. length) and access elements at each index.
forEach() methods provide a simpler way to iterate over arrays and NodeLists while still having access to the index. You pass a callback function into the forEach() method. The callback itself accepts three arguments: the current item in the loop, the index of the current item in the loop, and the array itself.
The for...of Loop iterates over iterable objects such as arrays, sets, maps, strings, and so on. It has the same syntax as the for...in loop, but instead of getting the key, it gets the element itself. This is one of the easiest methods for looping through an array and was introduced in later versions of JavaScript ES6.
Dealing with arrays is everyday work for every developer. In this article, we are going to see 6 different approaches to how you can iterate through in Javascript. The for loop statement has three expressions: Update - executed every time after the code block of the loop has been executed. A break statement can be used to stop the loop at any time.
The for/of loop statement has two expressions: The forEach () is a method of the array that uses a callback function to include any custom logic to the iteration. The forEach () will execute the provided callback function once for each array element.
A for loop examines and iterates over every element the array contains in a fast, effective, and more controllable way. The iterator variable i is initialized to 0. i in this case refers to accessing the index of the array. This means that the loop will access the first array value when it runs for the first time.
Use a for loop where i increases by 4.
Note: I was working on my answer when Jaromanda X commented the same thing.
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
for (var i = 0; i < arr.length; i += 4) {
console.log("Working with: " + arr.slice(i, i + 4));
}
Using ES6 and array functions:
const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
[...Array(Math.ceil(arr.length / 4)).keys()].forEach(i => {
const [a, b, c, d] = arr.slice(i * 4, (i+1) * 4)
// a, b, c and d are the four elements of this iteration
console.log(`iteration n°${i}`, a, b, c, d)
})
Notice: Math.ceil
is used to prevent any error if the array length is not divisible by 4
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With