inflearn logo
็Ÿฅ่ญ˜ๅ…ฑๆœ‰
inflearn logo

ๆœฌๅฝ“ใซ๏ผJavaScript๏ผˆใ‚ธใƒฃใƒใ‚นใ‚ฏใƒชใƒ—ใƒˆ๏ผ‰- ๅŸบ็คŽใ‹ใ‚‰ไธŠ็ดšใพใง

๐ŸŒŸ JavaScriptใฎๅŸบ็คŽใ‹ใ‚‰ไธŠ็ดšใพใงใ€ๆœฌ็‰ฉใฎ๏ผJavaScript่ฌ›ๅบงใ‹ใ‚‰ๅง‹ใ‚ใพใ—ใ‚‡ใ†๏ผ๐ŸŒŸ

้›ฃๆ˜“ๅบฆ ๅ…ฅ้–€

ๅ—่ฌ›ๆœŸ้–“ ็„กๅˆถ้™

JavaScript
JavaScript
ES6
ES6
es5
es5
oop
oop
JavaScript
JavaScript
ES6
ES6
es5
es5
oop
oop

ใŠ็Ÿฅใ‚‰ใ›

6 ไปถ

  • codingmax๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€

    ใ“ใ‚“ใซใกใฏใ€‚ใ‚ณใƒผใƒ‡ใ‚ฃใƒณใ‚ฐใƒžใƒƒใ‚ฏใ‚นใงใ™ใ€‚

    React Compilerๅ…ฌๅผใƒ‰ใ‚ญใƒฅใƒกใƒณใƒˆๅฎŒๅ…จใ‚ฌใ‚คใƒ‰็„กๆ–™่ฌ›ๅบงใ‚’ใƒชใƒชใƒผใ‚นใ—ใพใ—ใŸใ€‚

    ๐Ÿ‘‰https://inf.run/vAbPA

    d452baa0-0578-4400-aec4-ae2df96ccbe7.png

    React Compiler 1.0ใŒๆญฃๅผใƒชใƒชใƒผใ‚นใ•ใ‚ŒใŸใŸใ‚ใ€React Compilerใ‚’ๅฐŽๅ…ฅใ™ใ‚‹ใƒ—ใƒญใ‚ธใ‚งใ‚ฏใƒˆใŒใพใ™ใพใ™ๅข—ใˆใฆใ„ใใงใ—ใ‚‡ใ†ใ€‚ใ—ใŸใŒใฃใฆใ€Reactใ‚’ไฝฟ็”จใ™ใ‚‹ใƒ•ใƒญใƒณใƒˆใ‚จใƒณใƒ‰้–‹็™บ่€…ใฏใ€React Compilerใฎๅ†…ๅฎนใ‚’ๅฟ…ใš็†่งฃใ—ใฆใŠใๅฟ…่ฆใŒใ‚ใ‚Šใพใ™ใ€‚

    React Compilerๅ…ฌๅผใƒ‰ใ‚ญใƒฅใƒกใƒณใƒˆๅฎŒๅ…จใ‚ฌใ‚คใƒ‰่ฌ›ๅบงใ‚’้€šใ˜ใฆReact Compilerใ‚’็†่งฃใ—ใ€ไฝฟใ„ๆ–นใ‚’ๅญฆใ‚“ใงใฟใพใ—ใ‚‡ใ†ใ€‚

    ๆ–ฐ่ฆใƒ—ใƒญใ‚ธใ‚งใ‚ฏใƒˆใพใŸใฏๆ—ขๅญ˜ใƒ—ใƒญใ‚ธใ‚งใ‚ฏใƒˆใซReactใ‚ณใƒณใƒ‘ใ‚คใƒฉใ‚’ใฉใฎใ‚ˆใ†ใซๅฐŽๅ…ฅใ™ใ‚Œใฐใ‚ˆใ„ใ‹ๆˆฆ็•ฅใ‚’็ซ‹ใฆใ‚‹ใ“ใจใŒใงใใพใ™ใ€‚

    ๐Ÿ‘‰https://inf.run/vAbPA

    ใ‚ใ‚ŠใŒใจใ†ใ”ใ–ใ„ใพใ™ใ€‚

    ใ‚ณใƒผใƒ‡ใ‚ฃใƒณใ‚ฐใƒžใƒƒใ‚ฏใ‚นใ‚ˆใ‚Šใ€‚

    0
  • codingmax๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€

    ใ“ใ‚“ใซใกใฏ๏ผใ‚ณใƒผใƒ‡ใ‚ฃใƒณใ‚ฐใƒžใƒƒใ‚ฏใ‚นใงใ™ใ€‚

    ใŠไน…ใ—ใถใ‚Šใซใ”ๆŒจๆ‹ถใ„ใŸใ—ใพใ™ใ€‚๐Ÿ˜Š

    ่†จๅคงใชReact๏ผ

    Reactใฎๅ†…ๅฎนใ‚’็ฐกๅ˜ใซไผใˆใ‚‹ๆ–นๆณ•ใ‚’่€ƒใˆใ€ๅฐ่ชฌใฎใ‚นใƒˆใƒผใƒชใƒผๅฝขๅผใงReactใฎ่ช•็”Ÿใ‹ใ‚‰ใ‚ตใƒผใƒใƒผใ‚ณใƒณใƒใƒผใƒใƒณใƒˆใพใงๆ‰ฑใฃใฆใฟใ‚‹ใจ่‰ฏใ•ใใ†ใงใ™ใ€‚ใ‚นใƒˆใƒผใƒชใƒผใ‚’Ebookใซใ—ใฆไฝœใฃใฆใฟใพใ—ใŸใ€‚

    ใกใ‚‡ใ†ใฉInflearnใงใ‚ฏใƒชใƒƒใƒ—ใ‚’ๅ…ฌ้–‹ใ—ใฆใ„ใŸใ ใ„ใŸใฎใงใ€https://inf.run/j7GoEใง็พๅœจ็„กๆ–™ใงใƒ€ใ‚ฆใƒณใƒญใƒผใƒ‰ใ—ใฆใ™ใใซ่ชญใ‚€ใ“ใจใŒใงใใพใ™ใ€‚

    store_cover.png

    2013ๅนด5ๆœˆใ€Facebookใฎใ‚ใ‚‹ใ‚จใƒณใ‚ธใƒ‹ใ‚ขใŒJavaScriptใ‚ซใƒณใƒ•ใ‚กใƒฌใƒณใ‚นใง้œ‡ใˆๅฃฐใง่จ€ใ„ใพใ™ใ€‚

    HTMLใ‚’JavaScriptใฎไธญใซๅ…ฅใ‚Œใพใ—ใŸใ€‚

    ่ด่ก†ใฏใ–ใ‚ใ‚ใใ€่ชฐใ‹ใฏๅ˜ฒ็ฌ‘ใ—ใพใ—ใŸใ€‚ใ—ใ‹ใ—ใใฎๆ—ฅใ€ใ‚ฆใ‚งใƒ–้–‹็™บใฎๆญดๅฒใŒๅค‰ใ‚ใ‚Šใพใ—ใŸใ€‚

    ใ“ใฎๆœฌใฏใ€ReactใฎๆŠ€่ก“็š„ใชๅ†…ๅฎนใ‚’ๅฐ่ชฌๅฝขๅผใงๅฑ•้–‹ใ™ใ‚‹ๅฎŸ้จ“็š„ใช่ฉฆใฟใงใ™ใ€‚ๅ …่‹ฆใ—ใ„ๆ–‡ๆ›ธใ‚„ใƒใƒฅใƒผใƒˆใƒชใ‚ขใƒซใฎไปฃใ‚ใ‚Šใซใ€้–‹็™บ่€…ใŸใกใฎๆ‚ฉใฟใจ่งฃๆฑบ้Ž็จ‹ใ‚’ใ‚นใƒˆใƒผใƒชใƒผใƒ†ใƒชใƒณใ‚ฐใงๆใใพใ—ใŸใ€‚Facebookใฎๅฐใ•ใชใƒใƒƒใ‚ซใ‚ฝใƒณใƒ—ใƒญใ‚ธใ‚งใ‚ฏใƒˆใŒใฉใฎใ‚ˆใ†ใซไธ–็•Œไธญใฎ้–‹็™บ่€…ใŸใกใฎๅฟ…้ ˆใƒ„ใƒผใƒซใซใชใฃใŸใฎใ‹ใ€ใใฎ้Ž็จ‹ใ‚’ใ‚‚ใ†ๅฐ‘ใ—่ฆชใ—ใฟใ‚„ใ™ใใŠไผใˆใ—ใŸใ„ใจๆ€ใ„ใพใ—ใŸใ€‚

    ไปฎๆƒณDOMใฏๆœฌๅฝ“ใซๅคฉๆ‰็š„ใช็™บๆƒณใ ใฃใŸใฎใงใ—ใ‚‡ใ†ใ‹๏ผŸHookใฏใฉใฎใ‚ˆใ†ใซ่ช•็”Ÿใ—ใŸใฎใงใ—ใ‚‡ใ†ใ‹๏ผŸใ‚ตใƒผใƒใƒผใ‚ณใƒณใƒใƒผใƒใƒณใƒˆใฏไธ€ไฝ“ไฝ•ใ‚’่งฃๆฑบใ—ใ‚ˆใ†ใจใ—ใฆใ„ใ‚‹ใฎใงใ—ใ‚‡ใ†ใ‹๏ผŸ

    ใ‚ธใƒงใƒผใƒ€ใƒณใƒปใ‚ฆใ‚ฉใƒผใ‚ฏใฎๆœ€ๅˆใฎใƒ—ใƒญใƒˆใ‚ฟใ‚คใƒ—ใ‹ใ‚‰ใ€ใ‚ปใƒใ‚นใƒใƒฃใƒณใƒปใƒžใƒผใ‚ฏใƒ™ใƒผใ‚ฒใฎใ‚ณใƒณใ‚ซใƒฌใƒณใƒˆใƒขใƒผใƒ‰ใ€ใใ—ใฆๆœ€ๆ–ฐใฎReact 19ใพใงใ€‚ๆŠ€่ก“็š„ใชๆญฃ็ขบๆ€งใ‚’ไฟใกใชใŒใ‚‰ใ‚‚ใ€ใพใ‚‹ใงๅŒๅƒšใฎ้–‹็™บ่€…ใŒใ‚ณใƒผใƒ’ใƒผไธ€ๆฏ็ฝฎใ„ใฆ่žใ‹ใ›ใฆใใ‚Œใ‚‹ใ‚ˆใ†ใซๆฐ—่ปฝใซReactใฎๆญดๅฒใ‚’่พฟใฃใฆใฟใพใ™ใ€‚


    https://inf.run/j7GoE ใง็พๅœจ็„กๆ–™ใงใƒ€ใ‚ฆใƒณใƒญใƒผใƒ‰ใ—ใฆใ€ใ™ใใซใŠ่ชญใฟใ„ใŸใ ใ‘ใพใ™ใ€‚

    ใ‚ใ‚ŠใŒใจใ†ใ”ใ–ใ„ใพใ™ใ€‚

    0
  • codingmax๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€

    ใ“ใ‚“ใซใกใฏใ€‚ใ‚ณใƒผใƒ‡ใ‚ฃใƒณใ‚ฐใƒžใƒƒใ‚ฏใ‚นใงใ™ใ€‚

    ๆ•ฐๆ—ฅๅ‰ใซใ‚ณใƒผใƒ‰ใ‚ตใƒณใƒ‰ใƒœใƒƒใ‚ฏใ‚นใŒๆ›ดๆ–ฐใ•ใ‚Œใพใ—ใŸใ€‚

    1. ใ‚จใƒ‡ใ‚ฃใ‚ฟใฎๅค‰ๆ›ด

    2. ใƒใƒ‹ใƒฉใฎJavaScriptใƒ†ใƒณใƒ—ใƒฌใƒผใƒˆใŒๆถˆใˆใ‚‹

    ๆŽˆๆฅญใซ้–ขใ—ใฆใฏไธŠ่จ˜ใฎใ‚ˆใ†ใซๅคงใใไบŒใคใฎๅ†…ๅฎนใŒๅค‰ๆ›ดใ•ใ‚Œใพใ—ใŸใ€‚ใใฎใŸใ‚ใ€ใใฎๅ†…ๅฎนใซๅฏพๅฟœใ™ใ‚‹่ฌ›ๅบงใ‚’่ฟฝๅŠ ใ—ใฆใ€ไปฅไธ‹ใฎๅ†…ๅฎนใ‚’ไธ€็ท’ใซ่ชฟในใพใ™ใ€‚

    1. ๅค‰ๆ›ดใ•ใ‚ŒใŸใ‚จใƒ‡ใ‚ฃใ‚ฟใฎไฝฟใ„ๆ–นใจไปฅๅ‰ใฎใ‚จใƒ‡ใ‚ฃใ‚ฟใ‚’ๅ†ๅˆฉ็”จใ™ใ‚‹ๆ–นๆณ•

    2. ใƒใƒ‹ใƒฉJavaScriptใ‚ณใƒผใƒ‰ใ‚ตใƒณใƒ‰ใƒœใƒƒใ‚ฏใ‚นใ‚’ไฝœๆˆใ™ใ‚‹ๆ–นๆณ•

    image

    ใ‚ณใƒผใƒ‰ใ‚ตใƒณใƒ‰ใƒœใƒƒใ‚ฏใ‚นใฎใ‚ขใƒƒใƒ—ใƒ‡ใƒผใƒˆใŒใ‚ใพใ‚Šใซใ‚‚้ ป็นใงใ€ใƒใƒ‹ใƒฉใฎJavaScriptใƒ†ใƒณใƒ—ใƒฌใƒผใƒˆใŒๆถˆใˆใ‚‹ใ‚ˆใ†ใชๆฅต็ซฏใช๏ผˆ๏ผŸ๏ผ‰ใ‚ขใƒƒใƒ—ใƒ‡ใƒผใƒˆใชใฎใงใ€็งใ‚‚ๅฐ‘ใ—ๆˆธๆƒ‘ใ„ใพใ—ใŸใ€‚ใŠ้ก˜ใ„ใ—ใพใ™ใ€‚

    ใ‚ใ‚ŠใŒใจใ†ใ”ใ–ใ„ใพใ™ใ€‚ ๐Ÿ™‡โ€โ™‚๐Ÿ™โ€‹

    0
  • codingmax๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€

    ๏ฝฅ

    ไฟฎๆญฃๆธˆใฟ

    ใ“ใ‚“ใซใกใฏ๏ผๅ—่ฌ›็”Ÿใฎ็š†ใ•ใ‚“๏ผใ‚ณใƒผใƒ‡ใ‚ฃใƒณใ‚ฐใƒžใƒƒใ‚ฏใ‚นใงใ™๐Ÿ˜„

    ใ€Œ้…ๅˆ—ใƒกใ‚ฝใƒƒใƒ‰ใจๅฎฃ่จ€ๅž‹ใƒ—ใƒญใ‚ฐใƒฉใƒŸใƒณใ‚ฐ๏ผˆใƒชใ‚นใƒˆๆ“ไฝœ๏ผ‰ใ€ใ‚ปใ‚ฏใ‚ทใƒงใƒณใ‚’่ฟฝๅŠ ใ—ใพใ—ใŸใ€‚

    ๆ—ขๅญ˜ใฎ้ซ˜ๅบฆใช้ƒจๅ“ใฎใ€Œ้…ๅˆ—ใจ้ซ˜ๆฌก้–ขๆ•ฐใ€ใ‚ปใ‚ฏใ‚ทใƒงใƒณใงใ€้…ๅˆ—ๅ†…ใฎ่ค‡ๆ•ฐใฎ้ซ˜ๆฌก้–ขๆ•ฐใ‚’็›ดๆŽฅไฝœๆˆใ—ใพใ™ใ€‚็›ดๆŽฅๅฎŸ่ฃ…ใ™ใ‚‹ๅ‰ใซใ€ใ•ใพใ–ใพใช้…ๅˆ—ใƒกใ‚ฝใƒƒใƒ‰๏ผˆๆผ”็ฎ—ๅญ๏ผ‰ใ‚’็ดนไป‹ใ—ใชใŒใ‚‰ใ€ใƒชใ‚นใƒˆๆ“ไฝœใŒใชใœๅฟ…่ฆใงใ‚ใ‚Šใ€ๅฎฃ่จ€ๅž‹ใƒ—ใƒญใ‚ฐใƒฉใƒŸใƒณใ‚ฐใŒไฝ•ใชใฎใ‹ใ‚’่ชฟในใฆใฟใ‚‹ใจ่‰ฏใ„ใจๆ€ใ„ใ€ใ€Œ้…ๅˆ—ใƒกใ‚ฝใƒƒใƒ‰ใจๅฎฃ่จ€ๅž‹ใƒ—ใƒญใ‚ฐใƒฉใƒŸใƒณใ‚ฐ๏ผˆใƒชใ‚นใƒˆๆผ”็ฎ—๏ผ‰ใ€ใ‚ปใ‚ฏใ‚ทใƒงใƒณใ‚’่ฟฝๅŠ ใ—ใพใ—ใŸใ€‚

    ใพใŸใ€ๆ—ขๅญ˜ใฎ้ซ˜ๅบฆใชใƒ‘ใƒผใƒ„ใฎใ€Œ้…ๅˆ—ใจ้ซ˜ๆฌก้–ขๆ•ฐใ€ใ‚ปใ‚ฏใ‚ทใƒงใƒณใฎๅๅ‰ใ‚’ใ€Œ็›ดๆŽฅๅฎŸ่ฃ…ใ™ใ‚‹้…ๅˆ—ใฎ้ซ˜ๆฌก้–ขๆ•ฐใ€ใซๅค‰ๆ›ดใ—ใพใ—ใŸใ€‚

    image

     

     

     

    1
  • codingmax๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€

    ใ“ใ‚“ใซใกใฏ๏ผๅ—่ฌ›็”Ÿใฎ็š†ใ•ใ‚“๏ผใ‚ณใƒผใƒ‡ใ‚ฃใƒณใ‚ฐใƒžใƒƒใ‚ฏใ‚นใงใ™๐Ÿ˜„

    ใ€Œๆ•ฐๅ€คใฎ่กจ็พใจใƒใ‚คใƒŠใƒชใƒ“ใƒƒใƒˆๆผ”็ฎ—ใ€ใ‚ปใ‚ฏใ‚ทใƒงใƒณใ‚’่ฟฝๅŠ ใ—ใพใ—ใŸใ€‚

    • ใ‚ณใƒณใƒ”ใƒฅใƒผใ‚ฟใŒๆ•ฐๅญ—ใ‚’ใฉใฎใ‚ˆใ†ใซ่กจ็พใ—ใฆใ„ใ‚‹ใฎใ‹ใ‚’่ชฟในใฆใใ ใ•ใ„ใ€‚

    • ใ•ใพใ–ใพใชใƒ“ใƒƒใƒˆๆ“ไฝœใ‚’ไธ€็ท’ใซๆดป็”จใ—ใฆใฟใพใ™ใ€‚

    • ใใ—ใฆใ€2ใฎๅ ฑ้…ฌใŒใชใœๅฟ…่ฆใชใฎใ‹ใ‚’่ชฟในใฆ็†่งฃใ—ใพใ™ใ€‚

    • ๆœ€ๅพŒใซใ€ใƒใ‚คใƒˆใ‚ฝใƒผใƒˆ้ †ๅบใงใ‚ใ‚‹Little EndianใจBig Endianใซใคใ„ใฆไธ€็ท’ใซๅญฆใณใพใ™ใ€‚

    • ่ฌ›็พฉ่ณ‡ๆ–™ใซใ‚‚PPTใจใ‚ฝใƒผใ‚นใ‚ณใƒผใƒ‰ใ‚’ๆไพ›ใ—ใฆไธ€็ท’ใซๆ›ดๆ–ฐใ—ใพใ—ใŸใ€‚

    ใ‚ใ‚ŠใŒใจใ†ใ”ใ–ใ„ใพใ™๏ผ

    image

    1
  • codingmax๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€

    ใ“ใ‚“ใซใกใฏ๏ผๅ—่ฌ›็”Ÿใฎ็š†ใ•ใ‚“๏ผใ‚ณใƒผใƒ‡ใ‚ฃใƒณใ‚ฐใƒžใƒƒใ‚ฏใ‚นใงใ™๐Ÿ˜„

     

    ใ€Œๆ–‡ๅญ—ๅˆ—ใƒกใ‚ฝใƒƒใƒ‰ใจUnicodeใ€ใ‚ปใ‚ฏใ‚ทใƒงใƒณใ‚’่ฟฝๅŠ ใ—ใพใ—ใŸใ€‚

    JavaScriptๆ–‡ๅญ—ๅˆ—ใฎใ•ใพใ–ใพใชๆ“ไฝœใซๅฟ…่ฆใชๆ–‡ๅญ—ๅˆ—ใฎใ•ใพใ–ใพใชใƒกใ‚ฝใƒƒใƒ‰ใ‚’ๅญฆใณใพใ™ใ€‚

    JavaScriptใŒๆ–‡ๅญ—ใ‚’ใ‚จใƒณใ‚ณใƒผใƒ‰ใ™ใ‚‹ๆ–นๆณ•ใ‚’็†่งฃใ™ใ‚‹ใ‚ปใ‚ฏใ‚ทใƒงใƒณใ€‚

    ไปŠๅพŒๆ–ฐใŸใซ่ฟฝๅŠ ใ•ใ‚Œใ‚‹ใ‚ปใ‚ฏใ‚ทใƒงใƒณใซใฏใ€Œ่ฟฝๅŠ ใ‚ปใ‚ฏใ‚ทใƒงใƒณใ€ใจใ„ใ†่ฆ‹ๅ‡บใ—ใ‚’ใคใ‘ใพใ™๏ผ

    ใ‚ใ‚ŠใŒใจใ†ใ”ใ–ใ„ใพใ™๏ผ

    0

๏ฟฅ12,635