Introducing ECMAScript 2016

Transcript

1. Introducing ES2016
2. Meguro.es #4 @Wantedly 2016/06/21
3. Thank you Wantedly !!
4. PR::We are hiring !!
5. PR::We are hiring !!
6. whoami • @ikkou • Crea+ve Technology Group Manager • Love Front-end, especially Web VR • g1983ers • Meguro.es, Organizer • VR Tech Tokyo, Organizer
7. Meguro.es is Awesome JavaScript Community • 2016/04/19 Meguro.es #3 @Drecom • 2016/02/10 Meguro.es #2 @Drecom • 2015/12/08 Meguro.es #1 @Drecom
8. PR::VR Tech Tokyo • VR Tech Tokyo is Awesome VR Developer Community. • 2016/07/27 VR Tech Tokyo #2 <- New!! • 2016/05/26 VR Tech Tokyo #1
9. Introducing ES2016
10. ES2016͜ͱECMAScript 2016͕ 6݄17೔ʹϦϦʔε͞Ε·ͨ͠!
12. ES2016? ES7? Please stop referring to proposed JavaScript features as ES7 So I’m not the first to remind everyone and won’t be the last, but now that feature list for ES2016 aka ES7 is out, and doesn’t actually include any of the features most people talk about, it’s officially Cme to just stop using ES7 to mean “any proposed feature that may or may not even make it”.1 — Jay Phelps 1 Array.prototype.includes()͕ES2016ʹೖΓ·ͨ͠Ͷ - Qiita
13. ES7ݴ͏ͳ໰୊ ECMAScriptͷ৽͍͠࢓༷ࡦఆϓϩηεͷෆཧղ΍աڈͷܦҢ͔Β "ES7 Decorator" ΍ "ES7 Async/Await" ͱ͍͏ݴ༿͕࢖ΘΕ͕ͪͱ ͍͏໰୊͕͋ͬͨɻ͍Α͍ΑES7ͷػೳηοτ͕֬ఆͯ͠໌Β͔ ͳޡ༻ͱݴ͑ΔϨϕϧʹͳ͖ͬͯͨͷͰɺ͕͢͞ʹ΋͏࢖͏΂͖ Ͱͳ͍ɻ2 — @teppeis 2 ref. ES2016ͷ௥Ճػೳ͕ܾఆɺ͋Δ͍͸ES7ݴ͏ͳ໰୊
14. ͱ͍͏Θ͚ͰES7ͱ͍͏ݺশ͸࢖Θͣ ES2016ͱ͍͏ݺশΛ࢖͍·͠ΐ͏
15. ES2016Ͱ௥Ճ͞Εͨػೳ • Array.prototype.includes • exponen3a3on (**) operator ES2015Ͱ͸υόͬͱͨ͘͞Μͷػೳ͕௥Ճ͞Ε·͕ͨ͠ɺ ES2016Ͱ௥Ճ͞Εͨػೳ͸্هͷ2͚ͭͩͰ͢ɻ ೖΔͱࢥΘΕ͍ͯͨAsync/Await͸ೖΓ·ͤΜͰͨ͠ɻ
16. ϒϥ΢βରԠͷঢ়گ ECMAScript Next compa2bility tableΛࢀর • Array.prototype.includes • Chrome, Firefox, Edge 14+, Safari 9+ • exponenAaAon (**) operator • Chrome 52+, Edge 14+
17. Array.prototype.includes ϝιου
18. ಛఆͷཁૉ͕഑ྻʹؚ·Ε͍ͯΔ͔ Ͳ͏͔Λtrue·ͨ͸falseͰฦ͢
19. indexOf()ϝιου࣌୅ var ary = [ 1, 2, NaN ] ary.indexOf( 2 ) != -1 // true ary.indexOf( NaN ) != -1 // false
20. includes()ϝιου࣌୅ var ary = [ 1, 2, NaN ] ary.includes(2); // true ary.includes('2'); // false ary.includes(3); // false ary.includes(1, 1); // false ary.includes(2, -1); // false ary.includes(NaN); // true
21. includesͱindexOf͸NaNͷѻ͍͕ҟͳΔ var ary = [ 1, 2, NaN ] ary.indexOf( NaN ) != -1 // false ary.includes(NaN); // true
22. ͪͳΈʹ Meguro.es #1Ͱ@Layzieࢯ͕tc39/ecma262஌ͬͯ·͔͢?ͱ͍ ͏ൃදΛͨ͠ࡍʹɺ͜ͷArray.prototype.includes()ϝιο υʹݴٴ͍ͯ͠·ͨ͠ɻ1 ͦͯ͜͠ͷ࣌ʹυϥϑτʹೖͬͨͱ͍͏Θ͚ͰɺMeguro.esͱ ECMAScript͸ԕ͔ΒͣԿΒ͔ͷؔ܎ੑ͕ඍϨଘ……ɻ 1 Array.prototype.includes()͕ES2016ʹೖΓ·ͨ͠Ͷ - Qiita
23. exponen&a&on (**) operator
24. Math.pow()ΑΓ΋γϯϓϧʹ ΂͖৐ܭࢉΛॻ͚ΔΦϖϨʔλʔ
25. Math.pow࣌୅ // 2ͷ10৐ > Math.pow(2, 10); > 1024 // 10ͷ10৐ > Math.pow(10, 10); > 10000000000
26. Exponentiation Operator࣌୅ // 2ͷ10৐ > 2 ** 10 > 1024 // 10ͷ10৐ > 10 ** 10 > 10000000000 // equal a = a * a; > let a = 2; > a **= 10; > 1024
27. γϯϓϧʹॻ͚Δ!
28. ͚ͩͲ·ͩରԠϒϥ΢β͕ গͳ͍ͷͰBabel౳ඞਢ!
29. ·ͱΊ • ECMAScript 2016͕6݄17೔ʹϦϦʔε͞Ε·ͨ͠ • ͜Ε·ͰͷES5ͷΑ͏ʹES7ɺͱ͸ݴΘͳ͍Ͱ͍ͩ͘͞ • ES2016Ͱ͸Լهͷ2ͭͷػೳ͕௥Ճ͞Ε·ͨ͠ • Array.prototype.includes ϝιου • exponen8a8on (**) operator