Dev.to

JavaScript .forEach() por Baixo dos Panos

Você já deve saber o que é e para que serve o método forEach, mas já se perguntou como ele funciona de fato? [1,2,3,,5].forEach((n) => console.log(n)) // 1 // 2 // 3 // 5 De Acordo com a Especificação Para responder essa pergunta, vamos consultar a especificação oficial do ECMAScript. Resumidamente: forEach tem dois parâmetros: callback thisArg callback deve ser uma função com três parâmetros: o valor do elemento, o índice do elemento, o objeto iterado O método converte o valor de this em um objeto. (this é o nosso array iterado) Obtém o comprimento do objeto como um número. Verifica se o callback é uma função. Itera de k = 0 até k < len: Para cada índice existente (k in O), executa callback.call(thisArg, O[k], k, O). A especificação existe para que a implementação em diferentes motores JS (ex: V8, SpiderMonkey, JScript, etc) seja padronizada. Implementação em JavaScript Podemos fazer nossa própria implementação para melhor visualização: function forEach(callback, thisArg) { if (!this) { throw new TypeError('"this" is null or undefined'); } // 1. Let O be ? ToObject(this value). const O = Object(this); // 2. Let len be ? LengthOfArrayLike(O) const len = O.length; // 3. If IsCallable(callback) is false, throw a TypeError exception. if (typeof callback !== 'function') { throw new TypeError(callback + ' is not a function'); } // 4. Let k be 0. let k = 0; // 5. Repeat, while k < len, while (k

Apr 14, 2025 - 18:50
 0
JavaScript .forEach() por Baixo dos Panos

Você já deve saber o que é e para que serve o método forEach, mas já se perguntou como ele funciona de fato?

[1,2,3,,5].forEach((n) => console.log(n))
// 1
// 2
// 3
// 5

De Acordo com a Especificação

Para responder essa pergunta, vamos consultar a especificação oficial do ECMAScript. Resumidamente:

Diagrama

  1. forEach tem dois parâmetros:
    • callback
    • thisArg
  2. callback deve ser uma função com três parâmetros:
    • o valor do elemento,
    • o índice do elemento,
    • o objeto iterado
  3. O método converte o valor de this em um objeto. (this é o nosso array iterado)
  4. Obtém o comprimento do objeto como um número.
  5. Verifica se o callback é uma função.
  6. Itera de k = 0 até k < len:
  7. Para cada índice existente (k in O), executa callback.call(thisArg, O[k], k, O).

A especificação existe para que a implementação em diferentes motores JS (ex: V8, SpiderMonkey, JScript, etc) seja padronizada.

Implementação em JavaScript

Podemos fazer nossa própria implementação para melhor visualização:

function forEach(callback, thisArg) {
  if (!this) {
    throw new TypeError('"this" is null or undefined');
  }
  // 1. Let O be ? ToObject(this value).
  const O = Object(this);
  // 2. Let len be ? LengthOfArrayLike(O)
  const len = O.length;
  // 3. If IsCallable(callback) is false, throw a TypeError exception.
  if (typeof callback !== 'function') {
    throw new TypeError(callback + ' is not a function');
  }
  // 4. Let k be 0.
  let k = 0;
  // 5. Repeat, while k < len,
  while (k < len) {
    // a. Let Pk be ! ToString(
Read More

Tags:

Previous Article

Set up a new Mac

Next Article

What’s new in Next.js 15.3

Related Posts

Introducing Locally: A Rust-Powered Tool to Streamline Your Development Workflow

Introducing Locally: A Rust-Powered Tool to Streamline ...

Apr 10, 2025  0

Optimizing FID, LCP, and CLS: A Technical Deep Dive into Web Performance and Design Strategy

Optimizing FID, LCP, and CLS: A Technical Deep Dive int...

Apr 13, 2025  0

Feb 22, 2025  0