Exploring Iterables

🥑 Symbol.iterator

🥑 String is iterable

🥑 Calling an iterator explicitly

🥑 Iterables and array-likes

🥑 Array.from

JavaScript arrays are iterable, meaning they have a built-in Symbol.iterator method that allows them to be iterated over using loops or other constructs

For example:

const array = [1, 2, 3];
const iterator = array[Symbol.iterator]();
console.log(iterator.next()); // { value: 1, done: false }
console.log(iterator.next()); // { value: 2, done: false }
console.log(iterator.next()); // { value: 3, done: false }
console.log(iterator.next()); // { value: undefined, done: true }

Strings in JavaScript are also iterable, meaning they can be looped over character by character using the Symbol.iterator method

For example:

const str = 'hello';
for (let char of str) {
  console.log(char);
}
// Output: h, e, l, l, o

You can manually call the Symbol.iterator method of an iterable object to obtain an iterator, which can then be used to iterate over the elements

For example:

const array = [1, 2, 3];
const iterator = array[Symbol.iterator]();
console.log(iterator.next()); // { value: 1, done: false }

In JavaScript, iterables are objects that implement the Symbol.iterator method, allowing them to be iterated over

Array-like objects are objects that have indices and a length property but may not have the built-in methods of arrays like forEach or map

For example:

// Array-like object
const arrayLike = { 0: 'a', 1: 'b', 2: 'c', length: 3 };
// Iterating over array-like object
for (let item of arrayLike) {
  console.log(item);
}
// Output: a, b, c

The Array.from method creates a new, shallow-copied Array instance from an array-like or iterable object

For example:

const arrayLike = { 0: 'a', 1: 'b', 2: 'c', length: 3 };
const newArray = Array.from(arrayLike);
console.log(newArray); // Output: ['a', 'b', 'c']