Observable: forEach() method
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The forEach() method of the Observable interface returns a promise that fulfills with undefined when the source observable completes, after executing a callback for each emitted value.
Syntax
forEach(callback)
forEach(callback, options)
Parameters
callback-
A function to execute for each value emitted by the source observable. Its return value is ignored. The function is called with the following arguments:
optionsOptional-
An options object containing the following properties:
signalOptional-
An
AbortSignalthat can be used to cancel the operation. Aborting the signal unsubscribes from the source and rejects the promise with the signal'sreason. If the signal is already aborted, the promise rejects without subscribing to the source.
Return value
A Promise that fulfills with undefined when the source observable completes.
If the source errors or callback throws an exception, the promise rejects with that error. If the operation is aborted, the promise rejects with the abort reason.
Description
Like other promise-returning operators, this method subscribes to the source immediately when called. It does not require a separate call to subscribe().
forEach() calls callback once for each source value. If the source never completes, the promise remains pending unless the operation errors or is aborted.
The return value of callback is ignored. Returned promises are not awaited, and their rejections are not handled by forEach(). To wait for asynchronous work for each value, use flatMap() to return a promise from the mapper.
If callback throws an exception, the operation unsubscribes from the source.
Examples
Using forEach()
This example displays the coordinates of each of the first three button clicks, then adds a completion message. Click Restart after the stream ends to try again.
const btn = document.querySelector("button");
const output = document.querySelector("p");
const restart = document.querySelector("#restart");
function start() {
restart.disabled = true;
output.textContent = "Waiting for clicks";
btn
.when("click")
.take(3)
.forEach((event, index) => {
output.textContent = `Click ${index + 1}: ${event.clientX},${event.clientY}`;
})
.then(() => {
restart.disabled = false;
output.textContent += " — Count complete.";
});
}
restart.when("click").subscribe(start);
start();
Specifications
| Specification |
|---|
| Observable # dom-observable-foreach |