Code Ready | Frontend

А вы знаете, как работает for...of в JavaScript под капотом?

Для начала нужно понять, что такое итерируемый объект и итератор.
Любой объект, у которого есть метод Symbol.iterator, — итерируемый:

const nums = [10, 20, 30];
console.log(nums[Symbol.iterator]); // ƒ values() { [native code] }

Но сам цикл for...of работает не с массивом напрямую, а с его итератором.
Получим итератор вручную:

const iterator = nums[Symbol.iterator]();
console.log(iterator.next()); // { value: 10, done: false }
console.log(iterator.next()); // { value: 20, done: false }

А теперь — как for...of работает под капотом.
Он просто вызывает next() до тех пор, пока done !== true:

let result = iterator.next();
while (!result.done) {
  console.log(result.value);
  result = iterator.next();
}

🔥 Можно использовать итераторы для ленивой обработки данных, например при чтении потоков, больших массивов или генерации бесконечных значений.

📣 Code Ready | #практика

Please open Telegram to view this post

VIEW IN TELEGRAM

👍28🔥8🤝6👎1

www.tgoop.com/code_ready/1884

3.36K viewsJun 20 at 06:12

А вы знаете, как работает for...of в JavaScript под капотом?

Для начала нужно понять, что такое итерируемый объект и итератор.
Любой объект, у которого есть метод Symbol.iterator, — итерируемый:

const nums = [10, 20, 30];
console.log(nums[Symbol.iterator]); // ƒ values() { [native code] }

const iterator = nums[Symbol.iterator]();
console.log(iterator.next()); // { value: 10, done: false }
console.log(iterator.next()); // { value: 20, done: false }

let result = iterator.next();
while (!result.done) {
  console.log(result.value);
  result = iterator.next();
}