Something similar to question Convert ES6 Iterable to Array. But I only want first N items. Is there any built-in for me to do so? Or how can I achieve this more elegantly?

let N = 100;
function *Z() { for (let i = 0; ; i++) yield i; }

// This wont work
// Array.from(Z()).slice(0, N);
// [...Z()].slice(0, N)

// This works, but a built-in may be preferred
let a = [], t = Z(); for (let i = 0; i < N; i++) a.push(t.next().value);

Something similar to question Convert ES6 Iterable to Array. But I only want first N items. Is there any built-in for me to do so? Or how can I achieve this more elegantly?

let N = 100;
function *Z() { for (let i = 0; ; i++) yield i; }

// This wont work
// Array.from(Z()).slice(0, N);
// [...Z()].slice(0, N)

// This works, but a built-in may be preferred
let a = [], t = Z(); for (let i = 0; i < N; i++) a.push(t.next().value);

• javascript
• arrays
• slice
• infinite
• iterable

• Just make it a function. They are exactly for situations like this where you don't want to repeat (sometimes inelegant) logic. – ExPixel Commented Nov 29, 2017 at 1:59

5 Answers 5

To get the first n values of an iterator, you could use one of:

Array.from({length: n}, function(){ return this.next().value; }, iterator);
Array.from({length: n}, (i => () => i.next().value)(iterator));

To get the iterator of an arbitrary iterable, use:

const iterator = iterable[Symbol.iterator]();

In your case, given a generator function Z:

Array.from({length: 3}, function(){ return this.next().value; }, Z());

If you need this functionality more often, you could create a generator function:

function* take(iterable, length) {
  const iterator = iterable[Symbol.iterator]();
  while (length-- > 0) yield iterator.next().value;
}

// Example:
const set = new Set([0, 1, 2, 3, 4, 5, 6, 7, 8, 9]);
console.log(...take(set, 3));

There is no built in method to take only a certain number of items from an iterable (ala something like take()). Although your snippet can be somewhat improved with a for of loop, which is specifically meant to work with iterables, eg:

let a = []; let i = 0; for (let x of Z()) { a.push(x); if (++i === N) break; }

Which might be better since your original snippet would continue looping even if there are not N items in the iterable.

As of ECMAScript 2025, we have the iterator helper take, so now we can do:

// Example iterable: get its iterator (instance of Iterator)
const iterator = "StackOverflow"[Symbol.iterator]();

// Get first 5 into array
const arr = iterator.take(5).toArray();
console.log(arr);

// Iterator can still be consumed more (if you wanted to)
console.log(iterator.toArray());

A bit shorter and less efficient with .map, and a bit safer with custom function:

function *Z() { for (let i = 0; i < 5; ) yield i++; }

function buffer(t, n = -1, a = [], c) { 
    while (n-- && (c = t.next(), !c.done)) a.push(c.value); return a; }

const l = console.log, t = Z()

l( [...Array(3)].map(v => t.next().value) )

l( buffer(t) )

how can I achieve this more elegantly?

One possible elegant solution, using iter-ops library:

import {pipe, take} from 'iter-ops';

const i = pipe(
    Z(), // your generator result
    take(N) // take up to N values
); //=> Iterable<number>

const arr = [...i]; // your resulting array

P.S. I'm the author of the library.