settimeout-iif.js

100%

settimeout-iif.js

✓ Published0🌍 Public

Last edited Nov 22, 2014

Created on Nov 22, 2014

This example demonstrates how JavaScript’s closure scope preserves loop variable values inside asynchronous callbacks. The code defines a `tellMeLater` function that iterates ten times, each iteration wrapping a `setTimeout` call in an immediately-invoked function expression (IIFE). By passing `i` as an argument to the IIFE, each timeout callback logs its own unique index (0 through 9) after a 100-millisecond delay, avoiding the classic loop-variable capture problem. The example uses no external libraries, relying solely on native JavaScript `setTimeout` and `console.log` to show the expected sequential output.

AI-generated description

Similar vizzes

Loading thumbnail…

settimeout-example.js

This example demonstrates the use of `setTimeout` to schedule repeated asynchronous callbacks in JavaScript. It defines a `tellMeLater` function that loops ten times, invoking `setTimeout` with `log.bind(null, i)` to log each index after a 100-millisecond delay. The `log` function writes its argument to the console via `console.log`. The code shows how `Function.prototype.bind` creates a fixed argument for each scheduled call, ensuring the loop variable’s value is captured correctly despite the asynchronous execution.

Aalessioalex

85% match

Loading thumbnail…

Gist c38b5428350be0929bb330f44e6c9d82

This example contrasts two JavaScript approaches to looping over asynchronous tasks. It shows that an `async` loop with `await` inside a `for` loop executes each iteration sequentially, waiting for a five-second `setTimeout` before logging the next index, while a plain `Promise`-based loop fires all five calls concurrently, each logging after a two-second delay. The code uses native `async`/`await` and `Promise` constructors, with `setTimeout` simulating delay, and logs indices to the console. No external libraries or data sources are involved, highlighting raw JavaScript concurrency behavior.

Aamazingandyyy

63% match

Loading thumbnail…

Gist 5ef57ecbfb116e6b42706fb6a30b0987

This example demonstrates a common JavaScript scoping pitfall with the `var` keyword, contrasting it with `let`. It shows that declaring multiple variables in a single statement like `var i, r = 0;` only initializes the last variable (`r`), leaving `i` as `undefined`. Consequently, while loops testing `i < 10` never execute, while loops on `r` run ten times, printing "chau". The visualization, presented as a code gist, uses plain JavaScript console output via `console.log` within `while` loops, relying on the browser's or Node.js runtime rather than any external libraries. The gist highlights the importance of explicit initialization for each variable.

MMistyBlunch

61% match

Loading thumbnail…

Gist 7ef5a071200fae517638

This example demonstrates the execution order of Node.js timer and scheduling APIs by logging messages from `setTimeout`, `setImmediate`, and `process.nextTick`. The code creates an `EventEmitter` and schedules callbacks with zero-millisecond delays, including a nested `setTimeout` and `setImmediate` inside a 10-millisecond timeout. It shows how `process.nextTick` runs before `setImmediate`, while `setTimeout` and `setImmediate` ordering varies by context. The output is printed directly to the console using `console.log`.

Aackuser

59% match

Loading thumbnail…

Gist c0ec6bb768fd2672307b0807e4ee46fb

This example benchmarks four JavaScript loop styles—a standard `for` loop, a reversed `for` loop, a `for…of` loop, and `forEach`—on a fixed array of ten numbers. It measures execution time by repeating each loop a thousand times via `performance.now()` timestamps, accumulating the total milliseconds. The code defines each loop as a separate function and calls them through a `test` helper, logging the sum to the console. The comparison uses a simple in-memory data array, with no external libraries, focusing on raw loop performance in a JavaScript environment.

MMAKIO135

58% match

Loading thumbnail…

setTimeout/setInterval experiment involving slow-downs

This example demonstrates how `setTimeout` and `setInterval` differ in their behavior when a callback runs longer than the specified interval. It shows that `setInterval` can queue overlapping calls, while `setTimeout` waits for the previous execution to finish. The visualization uses a counter and a select menu to switch between the two methods, with a checkbox to artificially slow down the `tick` function via a blocking `while` loop. The code relies on D3.js v4 for DOM selection and event handling, and uses `window.setTimeout` and `window.setInterval` to schedule the counter updates. The counter increments by 0.5 every 500 milliseconds.

HHerst

57% match

Loading thumbnail…

async-for-each

This example demonstrates a sequential asynchronous loop over an array, where each item is processed only after the previous callback completes. It shows how `asyncForEach` awaits a user-provided callback that delays execution using a custom `waitFor` promise wrapper around `setTimeout`. The code uses the native `async`/`await` syntax and a `for` loop to ensure the array `[1, 2, 3]` is logged in order, with a one-second pause between each item. The visible data source is a hardcoded array in the `start` function, and the rendering approach is console output.

AA6Brgeuka

57% match

Loading thumbnail…

How good your JS?

This example demonstrates a common JavaScript closure pitfall inside a loop. The code defines an `addLinks` function that creates five anchor elements, each intended to alert its index when clicked. However, because the loop variable `i` is captured by reference in the click handler, every link alerts the final value, 5, instead of its own index. The visualization relies on the browser’s DOM API, including `document.createElement` and `element.onclick`, with the result shown when `window.onload` triggers the function. It highlights the difference between expected and actual behavior in event handling.

TTipTopCoder

57% match