Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
ES2017でjQuery
Search
camcam_lemon
July 15, 2018
Programming
0
68
ES2017でjQuery
ゆるクリ会(2018/7/14)
camcam_lemon
July 15, 2018
Tweet
Share
More Decks by camcam_lemon
See All by camcam_lemon
要素のサイズを変えずに押しやすくする
lemon
0
41
iOSのキーボード入力ビューをカスタマイズする
lemon
0
190
視え方と文字の大きさ
lemon
1
370
Yarn WorkSpaces × React Nativeの環境構築
lemon
0
260
フロントエンドにおけるアーキテクチャとの向き合い方
lemon
10
4.8k
UI/UXデザイナーがデザインしてるもの
lemon
2
310
react-reduxで追加されたHooks APIの良い所と使い方
lemon
5
950
ESLintで始めるTypeScriptの静的解析
lemon
8
2k
SEがエンジニアに目覚めデザイナーに転身した冒険譚
lemon
6
1.5k
Other Decks in Programming
See All in Programming
責務と認知負荷を整える! 抽象レベルを意識した関心の分離
yahiru
8
1.3k
Ça bouge du côté des animations CSS !
goetter
2
150
クリーンアーキテクチャから見る依存の向きの大切さ
shimabox
5
1k
パスキーのすべて ── 導入・UX設計・実装の紹介 / 20250213 パスキー開発者の集い
kuralab
3
890
プログラミング言語学習のススメ / why-do-i-learn-programming-language
yashi8484
0
160
Honoとフロントエンドの 型安全性について
yodaka
7
1.5k
Flutter × Firebase Genkit で加速する生成 AI アプリ開発
coborinai
0
170
メンテが命: PHPフレームワークのコンテナ化とアップグレード戦略
shunta27
0
300
PHPカンファレンス名古屋2025 タスク分解の試行錯誤〜レビュー負荷を下げるために〜
soichi
1
680
たのしいSocketのしくみ / Socket Under a Microscope
coe401_
8
1.3k
SwiftUI Viewの責務分離
elmetal
PRO
2
270
Formの複雑さに立ち向かう
bmthd
1
930
Featured
See All Featured
The Cost Of JavaScript in 2023
addyosmani
47
7.4k
Raft: Consensus for Rubyists
vanstee
137
6.8k
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
RailsConf 2023
tenderlove
29
1k
Mobile First: as difficult as doing things right
swwweet
223
9.4k
Building a Scalable Design System with Sketch
lauravandoore
461
33k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
233
17k
VelocityConf: Rendering Performance Case Studies
addyosmani
328
24k
Designing for Performance
lara
604
68k
Faster Mobile Websites
deanohume
306
31k
4 Signs Your Business is Dying
shpigford
182
22k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
160
15k
Transcript
ES2017ͰjQuery
Name ߕ൹ా ྄Ұ Twitter @camcam_lemon Company undefined Occupation ϑϩϯτΤϯυΤϯδχΞ Skills
React / Redux / PWA / GAS
None
“ φ͘jQueryΛॻ͍ͯΈΑ͏ɾɾɾʂʂ “
ΠέͯΔjQuery ˕ AjaxΛϞδϡʔϧԽ => ΤϥʔϋϯυϦϯάΛ෦ʹӅณ => PromiseԽ ˕ JSXϥΠΫʹappend()Λهड़ =>
ؔܕϓϩάϥϛϯάΛϑϧ׆༻ => ςϯϓϨʔτϦςϥϧͰϦʔμϒϧʹ
ී௨ͷAjax
None
_ajaxͷ͍ํ(thenable)
_ajaxͷ͍ํ(async/await)
ϞδϡʔϧԽͨ͠ajax ˕ඇಉظ௨৴ͷίʔϧόοΫࠈ͔Β٫ ˕ຖճajaxΛهड़͢ΔखؒΛলུ ˕Promise.allͱซ༻͢Δ͜ͱͰ͖Δ => initializeޙย͚ͷίʔυΛΊΔ
ී௨ͷappend
Ͳ͏هड़͢Δͷ͔ ˕ 1ͭͷappendͰશͯฦ͢Α͏ʹ͢Δ ˕ ReactͷΑ͏ʹ༩͑ΒΕͨprops(Ҿ)Λݩʹඳ ը͍ͯ͘͠ͷΛܾΊΔ ˕ ͔ؔΒؔΛݺͼग़ؔ͢ͷचͭͳ͗ ˕ ੍ޚॲཧϩδοΫΛىʹؔͱͯ͠ൈ͖ग़
͠ɺؔͷதʹด͡ࠐΊΔ
Reactͷॻ͖ํ
None
None
·ͱΊ ˕ES20xxͱjQueryͷ૬ੑ˓ (thisʹҙ) ˕ςϯϓϨʔτϦςϥϧ × append͕ΤϞ͍ ˕IEΓࣺͯͷཁ݅ͳΒͬͯΈΔͷ͍͍͔
“ ݁ہ jQuery ͬͯΦϫίϯͳͷʁ “
jQueryΦϫίϯʹର͢Δͷanswer Q. jQueryΦϫίϯ͔ʁ A. ΦϫίϯͰ͋Δ => ৽ن։ൃͰ࠾༻͢ΔϥΠϒϥϦʔͰͳ͍ => ϝϯςφϯε͢Δͷʹ jQueryͷιʔείʔυͭΒ͗͢Δɾɾɾ
͝੩ௌ ɹ͋Γ͕ͱ͏͍͟͝·ͨ͠