General API

each()

async

Executes sequential iteration over elements or a specified number of iterations.

  • Accepts the first argument as a function and an optional second argument as a boolean value (true or false):
    Argument
    Description
    true
    Perform recursive iteration through all nesting levels when looping over an object.
    The keys will be arrays containing ordered properties or indexes.
    false
    Iteration occurs only at the first level of nesting.
    This is the default value.
  • Iterates over an array, object, string, map, set, NodeList, HTMLCollection, or a specified number of iterations.
    Also supports any iterable objects, such as Generators or Typed Arrays.
  • Iterates only over the object's own (non-inherited) properties, eliminating the need to check them using hasOwnProperty.
  • Allows working with both values and keys simultaneously and also breaking the loop by returning false.
  • Built-in support for recursive object iteration.
  • Supports asynchronous functions, awaiting the completion of each function before starting the next iteration, and can also wait for the entire loop to complete by placing await before the loop.
Example:
// Iterates through the DOM elements, retrieving them.
$('div ?').each(value => {
   // your code
});

// Iterates through the DOM elements, retrieving both the elements and their indexes.
$('div ?').each((value, key) => {
   // your code
});

// Iterates through an array.
['book', 'cat'].each((value, key) => {});

// Iterates over the properties of an object at the first level of nesting.
({book: 10, cat: 20}).each((value, key) => {});

// Iterates through a string.
'book cat'.each((value, key) => {});

// Iterates through a Map.
new Map([['book', 10], ['cat', 20]]).each((value, key) => {});

// Iterates through a Set.
new Set(['book', 'cat']).each((value, key) => {});

// Performs the specified number of iterations.
(10).each((value, key) => {});

// Iterates through a Generator.
function* newGenerator() {
   yield 10;
   yield 20;
}
newGenerator().each((value, key) => {});

// Iterates through a Typed Array.
new Uint8Array([10, 20, 30]).each((value, key) => {});

// The loop will break completely when the condition is met.
['book', 'cat'].each(value => {
   if (value === 'book') {
      return false;
   }
});

// The next iteration will start only after all await functions have completed.
({book: 10, cat: 20}).each(async (value, key) => {
   await sleep(500);
});

let i = 0;
['book', 'cat'].each((value, key) => {
   i++;
   // During the first iteration, the variable "i" increases to 1.
   // During the second iteration, the variable "i" increases to 2.
});
// The variable "i" will be 0 after the loop, as the loop is asynchronous.

// Waits for the completion of the entire loop.
let i = 0;
await ['book', 'cat'].each((value, key) => {
   i++;
});
// The variable "i" will equal 2 after the loop.

// Waits for the completion of the entire loop with parallel iterations running.
await ['book', 'cat'].each(async (value, key) => {});

// Iterates through all nested levels of an object recursively.
({a: 10, b: {c: 20, d: {e: 30, f: [40, 50]}}}).each((value, key) => {}, true);

/*
   Iterates through all nested levels of an object recursively, 
   starting the next iteration only after all awaited functions have completed.
*/
({a: 10, b: {c: 20, d: {e: 30, f: [40, 50]}}}).each(async (value, key) => {
   await sleep(500);
}, true);

// Example of keys and values in a recursive iteration.
/*
   The key will be the array ['a'], and the value will be 10.
   The key will be the array ['b', 'c'], and the value will be 20.
   The key will be the array ['b', 'd', 'e'], and the value will be 30.
   The key will be the array ['b', 'd', 'f', 0], and the value will be 40.
   The key will be the array ['b', 'd', 'f', 1], and the value will be 50.
*/