Složení funkcí vysvětleno pomocí Pokémon Evolution

Jo, (šátkový) pes. Slyšel jsem, že máte rádi funkce, a tak jsem do ur funkce vložil funkci, abyste mohli fungovat, zatímco funguje.

KAŽDÝM, takže moje kamarádka se začínala učit kódovat a potřebovala pomoc s pochopením toho, co po ní učitel požaduje.

Tohle mi poslala:

/*
Create a function that takes in two inputs.
One should be a function and the other should be
the argument to call the input function with.

Then in the function you define call the passed in function
with the input argument. 
*/

...promiňte, ale lolwut?

Zde je příklad funkce, kterou poslala:

function sayHi(b,c){
c=prompt("Greet me!");
b(c);

Dobře, myslím, že je to trochu jasnější.

Tak, tady to je:

Z toho, co jsem pochopil, se snažíme vytvořit funkci, která spouští jinou funkci. Použil jsem koncept evoluce Pokémonů s kameny abych to ilustroval.

Evoluce je celková univerzální funkce.

function evolutionFn(pokemon, stone){
  stone = prompt('Which stone will you use?');
  return pokemon(stone);
}

Pokémoni sami jsou samostatné funkce, ale stále univerzálně využívají stejnou evoluční funkci. Nejlepším příkladem by bylo Eevee protože možnosti jejich vývoje jsou obrovské. (Ale pro tuto chvíli odkazujeme na jejich základní evoluci gen 1).


const eevee = (x) => {
  let userInput = x.toLowerCase();
  if ( userInput === 'fire' ){
    return 'Congrats! You now have a Flareon!'
  }else if( userInput ==='thunder' ){
    return 'Congrats! You now have a Jolteon!'
  } else if( userInput === 'water' ){
    return 'Congrats! You now have a Vaporeon!'
  } else {
    return 'Huh. It didn\'t work.'
  }
}

Také jsem vytvořil Pikachu, abych ilustroval, že tuto metodu evoluce může využít i úplně jiný Pokémon.


const pikachu = (x) => {
  let userInput = x.toLowerCase();
  if ( userInput === 'thunder'){
    return 'Congrats! You now have a Raichu!'
  } else {
    return 'Huh. It didn\'t work.'
  }
}

Dejte to všechno dohromady a dostaneme následující:

function evolutionFn(pokemon, stone){
  stone = prompt('Which stone will you use?');
  return pokemon(stone);
}

const eevee = (x) => {
  let userInput = x.toLowerCase();
  if ( userInput === 'fire' ){
    return 'Congrats! You now have a Flareon!'
  }else if( userInput ==='thunder' ){
    return 'Congrats! You now have a Jolteon!'
  } else if( userInput === 'water' ){
    return 'Congrats! You now have a Vaporeon!'
  } else {
    return 'Huh. It didn\'t work.'
  }
}

const pikachu = (x) => {
  let userInput = x.toLowerCase();
  if ( userInput === 'thunder'){
    return 'Congrats! You now have a Raichu!'
  } else {
    return 'Huh. It didn\'t work.'
  }
}

console.log(evolutionFn(eevee));
// example: if prompt => 'fire or FIRE or even FiRe', 
// it will say "Congrats! You now have a Flareon!"
// if it's anything else, the console will return "Huh. It didn't work."


console.log(evolutionFn(pikachu));
// Should return "Congrats you now have a Raichu"! etc. etc.

Hrajte s ním živě na Repl.it !

A tady to máte – Složení funkcí:když chcete použít velkou funkci k provádění malých funkcí, které v podstatě budou mít stejnou základní věc.

Také, zábavný fakt - byli jste oklamáni! Pokud jste někdy používali .map(), .split(), .join(), .reverse(), už jste zažili kompozici funkcí! Vidíme to v akci, když používáme metody JavaScriptu ALL. THE. ČAS.

Děkujeme za přečtení!

Pokud se mnou chcete zůstat v kontaktu, sledujte mě na Twitteru! DM jsou otevřené.

Přihlaste se také k odběru mého newsletteru, kde vám poskytnu tipy/triky, jak přežít kódování bootcamp a post-bootcamp/učení na vlastní pěst sdílením osobních (někdy trapných) příběhů!