Using ES6 generators for custom iterators

We looked at the basics of using ES6 generators in this post. Generators also come with symbol iterators which can be applied to objects. A symbol iterator helps us implement a custom iterator for our objects. We can declare how our object should behave in a for-of loop. Symbol iterators also involve some weird syntax but generators are weird anyway so a little more weirdness should be fine.

Let’s start off with a simple example:

let partyOrganisation = {
  host: 'John',
  dj: 'Jane',
  food: 'Peter',
  games: 'Mary'
}

Now we want to iterate through the people in the party organisation committee in a for loop. We can add a symbol iterator and assign a generator function to it as follows:

let partyOrganisation = {
  host: 'John',
  dj: 'Jane',
  food: 'Peter',
  games: 'Mary',
  [Symbol.iterator]: function* () {
    yield this.host
    yield this.dj
    yield this.food
    yield this.games
  }
}

The symbol iterator declaration is a bit ugly. You’ll recognise the generator declaration using * and the yield keyword from the post referenced above.

We can now iterate through all members of the object:

for (let member of partyOrganisation) {
  console.log(member)
}

This will print…

John
Jane
Peter
Mary

…in the developer console.

Now we also want to have a couple of guests for a party:

let guests = {
  bestFriend: 'William',
  father: 'Richard',
  mother: 'Susan',
  neighbourLeft: 'Andrew',
  neighbourRight: 'Lisa',
  [Symbol.iterator]: function* () {
    yield this.bestFriend
    yield this.father
    yield this.mother
    yield this.neightbourLeft
    yield this.neightbourRight
  }
}

Finally we want to join the two in a party object and have an iterator that calls upon the iterators of the party organisation and guests object. We can achieve it in the following way:

let party = {
  partyOrganisation,
  guests,
  [Symbol.iterator]: function* () {
    yield* this.partyOrganisation
    yield* this.guests
  }
}

Applying the * operator on the yield keyword declares that we want to call the iterator of the provided object. We can now loop through the party members:

for (let participant of party) {
  console.log(participant)
}

…which will print all participants of the party.

View all posts related to JavaScript here.

Advertisements

About Andras Nemes
I'm a .NET/Java developer living and working in Stockholm, Sweden.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

ultimatemindsettoday

A great WordPress.com site

Elliot Balynn's Blog

A directory of wonderful thoughts

Robin Sedlaczek's Blog

Developer on Microsoft Technologies

HarsH ReaLiTy

A Good Blog is Hard to Find

Softwarearchitektur in der Praxis

Wissenswertes zu Webentwicklung, Domain-Driven Design und Microservices

the software architecture

thoughts, ideas, diagrams,enterprise code, design pattern , solution designs

Technology Talks

on Microsoft technologies, Web, Android and others

Software Engineering

Web development

Disparate Opinions

Various tidbits

chsakell's Blog

Anything around ASP.NET MVC,WEB API, WCF, Entity Framework & AngularJS

Cyber Matters

Bite-size insight on Cyber Security for the not too technical.

Guru N Guns's

OneSolution To dOTnET.

Johnny Zraiby

Measuring programming progress by lines of code is like measuring aircraft building progress by weight.

%d bloggers like this: