Upgrade to Pro — share decks privately, control downloads, hide ads and more …

JS/Reactを初心者に説明するときに困ったポイント

 JS/Reactを初心者に説明するときに困ったポイント

JS/Reactを初心者に説明するときに困ったポイントを紹介。
主にReactのコンポーネントに関数を渡すことについて。

Naoya Ishii

March 20, 2018
Tweet

More Decks by Naoya Ishii

Other Decks in Technology

Transcript

  1. +BWB4DSJQU3FBDUΛ
    ॳ৺ऀʹઆ໌͢Δͱ͖ʹ
    ࠔͬͨϙΠϯτΛڞ༗͍ͨ͠ʂ
    !LBJEFNQB

    View full-size slide

  2. ࣗݾ঺հ
    ੴҪ௚໼!LBJEFNQB
    ϑϩϯτΤϯυΤϯδχΞ೥໨
    3FBDU3FEVY
    εϓϥϞϯϋϯ16#(

    View full-size slide

  3. ຊΛॻ͖·ͨ͠ʂ
    3FEVYʹ͍͔ͭͯͬ͠Γઆ໌͍ͯ͠Δ
    ʢݱ࣌఺Ͱ͸ʣ།Ұͷॻ੶ͩͱࢥ͍·͢ɻ

    View full-size slide

  4. +BWB4DSJQU͸೉͍͠
    w ʮͦΕ͸ࠓ࢖Θͳ͍ΜͩΑͶʯʮͦΕ݁ߏ࢖͏ΜͩΑͶʯ
    w ʮ͋ʔͦΕ&4ͳΒ͜͏ॻ͚ΔΑʯ
    w ʮͦΕ·ͩਖ਼ࣜʹ͸࢓༷͡Όͳ͍ΜͩΑͶʙʯ

    View full-size slide

  5. +BWB4DSJQU͸೉͍͠
    w ແ໊ؔ਺ʁಗ໊ؔ਺ʁଈ࣌ؔ਺ʁߴ֊ؔ਺ʁ
    w GVODUJPOจͱΞϩʔϑΝϯΫγϣϯͬͯͲ͏ҧ͏ͷʁ
    w UIJTͬͯԿʁ

    View full-size slide

  6. 3FBDU3FEVY͸೉͍͠
    w +4 +49
    w 1SPQT 4UBUF
    w εςʔτϨεͬͯԿʁϐϡΞͬͯԿʁ
    w $BOOPUSFBEQSPQFSUZTFU4UBUFPGVOEFpOFE

    View full-size slide

  7. w ׳ΕͯΔ͔ΒΘ͔Δ͚ͲɺͪΌΜͱઆ໌͠Α͏ͱ͢Δͱ೉͍͜͠ͱ
    ͕ଟ͍Ͱ͢ΑͶɻ
    w ͦΜͳʮΘ͔ΒΜʯ͕٧·ͬͨྫͱͯ͠ɺ

    Ϙλϯʹؔ਺Λඥ෇͚Δ

    ͕͋Δͱࢥ͍·͢ɻ

    View full-size slide

  8. Ϙλϯʹؔ਺Λඥ෇͚Δ
    w ΍Γํ͕ͦ΋ͦ΋ෳ਺͋Δ
    w 

    ίϯετϥΫλͰUIJTIBOEMF$MJDLUIJTIBOEMF$MJDLCJOE UIJT

    w 

    IBOEMF$MJDL
    \^
    w 

    CVUUPOPO$MJDL\
    \UIJTIBOEMF$MJDL
    ^^

    View full-size slide

  9. ਖ਼ղ͸ɾɾɾແ͍ʁ
    w ͷॻ͖ํ͕͍͍ͳͱࢥ͍·͢ɻ
    w Ұ൪UZQFྔ͕গͳ͍ʂ
    w ύϑΥʔϚϯεͰ΋ෆརͳ఺͕ͳ͍

    View full-size slide

  10. Ͱ΋આ໌͕೉͍͠
    w ·ͩຊ࠾༻͞Εͯͳ͍จ๏ TUBHF
    ͦΖͦΖ࠾༻

    IUUQTHJUIVCDPNUDQSPQPTBMDMBTTpFMET
    w ʮͦ͏͍͏΋ΜͩΑʯͱݴ͏ͷ͸؆୯͕ͩɺͦΕͩͱԠ༻ͷར͔ͳ
    ͍ΤϯδχΞʹͳͬͪΌ͏͔΋

    View full-size slide

  11. ඥղ͍͍ͯ͘
    w &$."4DSJQUͷ$MBTT'JFME

    ϓϩϙʔβϧͱ͸ɺΠϯελϯ
    εม਺Λ؆қʹॻ͚Δ࢓૊Έɻ
    w Ͱ΋ϓϩϙʔβϧͷྫͰ͸ؔ਺
    ͸ࠓ·Ͱͷํ๏ͰCJOE͞Εͯ
    Δɻɻɻ

    View full-size slide

  12. ඥղ͍͍ͯ͘
    w ੔਺Λఆٛ͢Δͷͱಉ͡Α͏ʹɺ
    ؔ਺Λఆٛ͢Δɻ
    w Ͱ΋͜͜ͰGVODUJPOࣜΛ࢖͏ͱ
    ͩΊʼʻ
    w GVODUJPOจͱΞϩʔϑΝϯΫγϣ
    ϯͰ͸UIJTͷѻ͍͕ҧ͏͜ͱΛ
    ஌͍ͬͯͳ͍ͱϋϚͬͯ͠·͏ɻ

    View full-size slide

  13. ඥղ͍͍ͯ͘
    w ΞϩʔϑΝϯΫγϣϯ͸ࣗಈత
    ʹจ຺্ͷUIJTʹόΠϯυͯ͠
    ͘ΕΔʢ͜͜΋આ໌͕೉͍͠ʣ
    w ͜ͷੑ࣭Λ$MBTT'JFMEϓϩϙʔ
    βϧͷதͰ࢖͏͜ͱͰɺظ଴௨
    ΓͷڍಈΛ͢ΔϝιουఆٛΛ
    ͍ͯ͠Δɻ

    View full-size slide

  14. ͜͏͍͏ʮΘ͔ΒΜʯΛڞ༗͍͖͍ͯͨ͠
    w օ͞Μͷઆ໌ʹࠔͬͨϙΠϯτΛͥͻڭ͍͑ͯͩ͘͞ʂ
    w ΋͠ɺͳΜͱͳ͘࢖͍ͬͯΔͱ͜Ζ͕͋Ε͹օͰਂ۷Γ͍͖ͯͨ͠
    ͍Ͱ͢Ͷɻ

    View full-size slide

  15. ͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠
    w ຊ΋ΑΖ͘͠Ͷὑ
    w 3FBDUೖ໳3FBDUɾ3FEVYͷಋೖ͔Β
    αʔόαΠυϨϯμϦϯάʹΑΔ69ͷ
    ޲্·Ͱ /&950/&

    w IUUQBN[OBTJBFP"O'-:

    View full-size slide