Angular2 => operator
<p>I'm currently reading the tutorial named "Tour of heroes" from and I have a part which is unclear. </p>

<p>I'm having the service:</p>

<pre><code>import { Injectable } from '@angular/core';

import { Hero } from './hero';
import { HEROES } from './mock-heroes';

@Injectable()
export class HeroService {
    getHeroes(): Promise&lt;Hero[]&gt; {
        return Promise.resolve(HEROES);
    }

    getHeroesSlowly(): Promise&lt;Hero[]&gt; {
      return new Promise&lt;Hero[]&gt;(resolve =&gt;
        setTimeout(resolve, 2000)) // delay 2 seconds
        .then(() =&gt; this.getHeroes());
    }

    getHero(id: number): Promise&lt;Hero&gt; {
      return this.getHeroes()
                 .then(heroes =&gt; heroes.find(hero =&gt; hero.id === id));
    }

}
</code></pre>

<p>And the next mock:</p>

<pre><code>import { Hero } from './hero';

export const HEROES: Hero[] = [
  { id: 11, name: 'Mr. Nice' },
  { id: 12, name: 'Narco' },
  { id: 13, name: 'Bombasto' },
  { id: 14, name: 'Celeritas' },
  { id: 15, name: 'Magneta' },
  { id: 16, name: 'RubberMan' },
  { id: 17, name: 'Dynama' },
  { id: 18, name: 'Dr IQ' },
  { id: 19, name: 'Magma' },
  { id: 20, name: 'Tornado' }
];
</code></pre>

<p>All is running well but a specific part is a little unclear for me and would be great if someone can clarify me.</p>

<p>The part of which I'm talking about is:</p>

<pre><code>return this.getHeroes()
                 .then(heroes =&gt; heroes.find(hero =&gt; hero.id === id));
</code></pre>

<p>from service.</p>

<p>I've understood that first is called getHeroes() method which returns the list from the mock but after that what happens? :)</p>

<p>Long story short, what is the deal with <code>heroes =&gt; heroes.find(hero =&gt; hero.id === id)</code></p>

<p>Thank you for your quick comments!</p>

<p>Now I understood what is the deal with '=>' but what I still don't get is from where <strong>hero</strong> object appears in
<code>heroes =&gt; heroes.find(hero =&gt; hero.id === id)</code></p>