Discussion on: List common use cases for generator functions in JavaScript

View post

My favorite application of generator functions probably has to be async iterators within the context of pagination for data fetching. My react applications can defer asking for more pages until they've scrolled past a certain point on the current view.

🦁 Yvonnick FRIN • Nov 8 '19

Didn't thought about it 👍, do you have an example of implementation ?

ZaneHannanAU • Nov 9 '19

async function* paginate(current) {
  const url = new URL('/api/data', location.href);
  while (1) {
    url.searchParams.set('from', current);
    const res = await fetch(url.href);
    if (res.ok) {
      let j = await res.json();
      let page = yield j.data;
      current = page == null ? j.next : page === -1 ? j.prev : j.next;
    } else {
      throw await (res.headers.get('content-type') === 'application/json' ? res.json() : res.text());
    }
  }
}

Although I'd recommend something almost totally different with skips and all, it's up to you.