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
安全なJavaScriptを書く
Search
Kohei Asai
December 15, 2015
Programming
22
8.3k
安全なJavaScriptを書く
SCRIPTY #4 on 2015-12-15
Kohei Asai
December 15, 2015
Tweet
Share
More Decks by Kohei Asai
See All by Kohei Asai
The State Transparented Web Application
axross
1
230
UIコンポーネント指向と「協働」
axross
6
2.7k
Introduction to Redux
axross
34
21k
作るのにデザイナーもエンジニアもない
axross
15
7.1k
なぜprottか
axross
4
2.6k
コンポーネント指向による、Reactのベストプラクティスとバッドプラクティス
axross
0
360
Nodeとフロントエンド − 知っておかなければならない、今と未来の話 −
axross
2
1.3k
gulpを使うと彼女ができるよ - かんたんな紹介とハンズオン
axross
2
990
Other Decks in Programming
See All in Programming
Snowflake x dbtで作るセキュアでアジャイルなデータ基盤
tsoshiro
2
520
距離関数を極める! / SESSIONS 2024
gam0022
0
280
AI時代におけるSRE、 あるいはエンジニアの生存戦略
pyama86
6
1.1k
3rd party scriptでもReactを使いたい! Preact + Reactのハイブリッド開発
righttouch
PRO
1
600
A Journey of Contribution and Collaboration in Open Source
ivargrimstad
0
890
よくできたテンプレート言語として TypeScript + JSX を利用する試み / Using TypeScript + JSX outside of Web Frontend #TSKaigiKansai
izumin5210
6
1.7k
見せてあげますよ、「本物のLaravel批判」ってやつを。
77web
7
7.7k
subpath importsで始めるモック生活
10tera
0
300
Flutterを言い訳にしない!アプリの使い心地改善テクニック5選🔥
kno3a87
1
150
TypeScript Graph でコードレビューの心理的障壁を乗り越える
ysk8hori
2
1.1k
Contemporary Test Cases
maaretp
0
130
Duckdb-Wasmでローカルダッシュボードを作ってみた
nkforwork
0
120
Featured
See All Featured
How STYLIGHT went responsive
nonsquared
95
5.2k
Building a Modern Day E-commerce SEO Strategy
aleyda
38
6.9k
Designing for humans not robots
tammielis
250
25k
Building Applications with DynamoDB
mza
90
6.1k
A Philosophy of Restraint
colly
203
16k
Designing the Hi-DPI Web
ddemaree
280
34k
YesSQL, Process and Tooling at Scale
rocio
169
14k
How to train your dragon (web standard)
notwaldorf
88
5.7k
Building a Scalable Design System with Sketch
lauravandoore
459
33k
Fantastic passwords and where to find them - at NoRuKo
philnash
50
2.9k
A Modern Web Designer's Workflow
chriscoyier
693
190k
Designing for Performance
lara
604
68k
Transcript
҆શͳJavaScriptΛॻ͘ @axross SCRIPTY #4 on 2015-12-15
whoami » @axross / Kohei Asai » Gunosy Inc. »
ωτήഇਓ -> հޢۀք -> Webۀք » SPAॻ͍͓ͯۚΒͬͯ·͢
ͨΓલͳ͜ͱΛ͠· ͢
ʮྫ֎ʯ
ྫ֎ʹର͢Δೝࣝ » Errorͷ͜ͱ » ྫ֎͕εϩʔ͞Εɺcatch͞Εͯͳ͍߹ɺ࣮ߦ͕ࢭ·Δ » ϓϩμΫγϣϯͰ࣮ߦ͕ࢭ·Δͱக໋త » ʮۃྗΤϥʔϋϯυϦϯά͠Α͏ʂʯͬͯؾ࣋ͪʹͳΔ͕...ʁ
None
27. ʮࢮ͵ͣͷϓϩάϥϜΛແཧʹ ੜ͔͓͍͍͚ͯͯ͠ͳ͍ʯ try-catch ϒϩοΫΛίʔυϕʔεʹେྔʹೖΕΕɺʮྫ֎͕ൃੜͯ͠ ઈରʹࢭ·Βͳ͍ʯͱ͍͏ΞϓϦέʔγϣϯΛ࡞Δ͜ͱ͕Մೳͳͣ Ͱ͢ɻ ͨͩɺ͜Εɺ͏ࢮΜͰ͍ΔਓͷମΛఝ͔Կ͔Ͱݻఆ͠ɺແཧཧ ཱͬͨঢ়ଶʹ͍ͯ͠ΔΑ͏ͳͷͰ͕͢......ɻ --
ΦϥΠϦʔɾδϟύϯʮϓϩάϥϚ͕Δ͖97ͷ͜ͱʯ
ແཧΓੜ͔͞ΕͨϓϩάϥϜ » ϓϩμΫγϣϯͰྫ֎͕throw͞ΕͯͳΒͳ͍ » ͳͥͳΒɺϓϩάϥϜͷ࣮ߦ͕ࢭ·ͬͯ͠·͏͔Β » Ͱɺͦͷྫ֎ԿʹΑΔͷͳͷ͔ʁ » ڥɾঢ়گʹΑͬͯൃੜͨ͠ͷʁ(HTTPݻ༗όάͳͲ) »
୯७ͳ։ൃऀͷϛεʹΑΔͷʁ » ͜ͷྫ֎ΛcatchͰ௵͢ͷϚζ͍Μ͡Όͳ͍ͩΖ͏͔ʁ
ߟ͑Δ͖͜ͱ » ਖ਼ৗͳಈ࡞Ͳ͏͍͏ܗͳͷ͔ʁ » ͕ؔҙਤ͠ͳ͍ҾΛͬͯݺΕͨΒʁ » ͜͜Λ༨ܭͳ͓ੈͰʹʮແࢹ͢Δʯͱ͔ͯ͠͠·͏ͱɺ։ൃ ऀͷਓతͳϛεڐ͢Մೳੑ͕͋Δ » ʮ͜͏͍͏έʔε͋Δ͔͠Εͳ͍ʯͱ͍͏ରԠΑ͘ͳ͍
» ʮ͍͚͋ͬͯͳ͍ɺ͔ͩΒྫ֎ͩʯ » ͜Ε͕ྫ֎ͷਖ਼͍͠ΘΕํͩͱࢥ͏
ʮؾ͔ͳ͍ʯํ͕ා͍ » ༏͗͢͠ΔAPI࡞Βͳ͍ » ʮArray͡Όͳͯ͘ड͚͚Δ෮ॲཧͷؔʯΛͲ͏ࢥ͏͔ʁ » νʔϜͰೝ͕ࣝ߹ͬͯΕ͍͍ » ͔͠͠ɺόάʹʮؾ͚ͳ͘ͳΔʯͷશʹବ »
σόοάςετόάΛݕग़͢ΔͨΊʹ͋Δ » ݕग़Ͱ͖ͳ͘ͳͬͯ͠·ͬͨΒɺͦΕʮ༏͍͠ʯͩΖ͏͔ʁ
Ͳ͏ͨ͠Β͍͍͔
throwΛා͕Γ͗͢ͳ͍ » throw͖͢ͷͪΌΜͱ͠Α͏ » ։ൃதʹྫ֎Λ౿ΊΕɺݕग़ͮ͠Β͍όάΛ༧ͨ͜͠ͱʹͳ Δ » ʮਖ਼ৗಈ࡞ͳΒى͜Δͣͷͳ͍throwʯා͕Γա͗ͳ͍͍ͯ͘ Α͏ͳʁ »
ແɺͪΌΜͱσόοάஈ֊Ͱݕग़͓ͯ͘͠ » Ϗδωεతͳສ͕Ұʹඋ͑ͯɺϦΧόϦʔͰ͖ΔΑ͏ʹ࡞Δ
assert / unassert » twada/unassert » ίʔυதͷassert()console.assert()Λআ͢Δͷ » throwͷΘΓʹassert()ΛͬͯɺAssertionErrorΛ͛Δ »
assert()ͳͲͷ෦͚͕ͩunassertʹΑͬͯআ͞ΕɺϓϩμΫ γϣϯ࣌ʹAssertionError͕ൃੜ͠ͳ͘ͳΔ » http://www.slideshare.net/t_wada/unassert
ΤϥʔΛऩू͢Δ » window.onerrorͰ΄΅શͯͷྫ֎ΛcatchͰ͖Δ » catchͨ͠ͷΛΤϥʔऩूαʔϏεʹ͛Δ » Sentry » Airbrake »
sourcemaps͕͋ΕಡԽޙͷίʔυղऍͯ͘͠ΕΔ » ͋Δ͍ɺGoogle AnalyticsʹஷΊΔ » ྫ֎Λऩूͯ͠ɺঢ়گݻ༗ݻ༗ͷόάΛݕग़͠Α͏
Lint͢Δ » eslintɺjshintɺjslint » ίʔυͷόουϓϥΫςΟεγϯλοΫεΤϥʔΛݕͯ͠ڭ͑ ͯ͘ΕΔ » ελϯεΛܾΊͯɺݫ͠Ίʹઃఆ͢Δɺ͖ͦͯͪ͠ΜͱकΔ » ਓతͳϛεΛ͍͘Β͔ݮͰ͖Δ
» ؇ΊΔͷةݥɺ؇ΊΔ߹͖ͪΜͱ͠߹͏ » ઃఆϑΝΠϧΛॻ͘͜ͱͰɺֶͼ͋Δ͔ʁ
ςετΛॻ͘ » ྫ֎ɺςετΛॻ͍ͯ։ൃதʹ͖ͪΜͱग़ձ͓ͬͯ͘ » ςετ͕େมͩͱײͨ͡ΒɺͦΕਓతϛε͕ى͖͍͢ͱ͍͏αΠ ϯ » ޙʑʹόάͷݪҼΛḷΔ͍͍ಓඪʹͳΔ » αϘͬͪΌବ!
ίʔυϨϏϡʔ͢Δ » Lintͯ͠ɺςετΛॻ͍ͯɺϛεΛ͢Δ͜ͱ͋Δ » ਓతͳϛεΛݟ͚ͭΒΕΔۀϑϩʔΛ͖ͪΜͱ࡞Ζ͏ » ϛεΛؾܰʹࢦఠͰ͖Δۭؾ࡞ΓΛ͠Α͏ » ϨϏϡʔͯ͠ίʔυΛڞ༗͓͚ͯ͠ɺଞͷਓ͕༨ܭͳϛεΛ͠ͳ͘ ͯࡁΉ
·ͱΊ » ʮͦͷྫ֎ຊʹѲΓ௵͍͍ͯ͠ͷͩΖ͏͔ʁʯ » ͦΕ͕ʮͲ͏͍͏ྫ֎ͳͷ͔ʯΛ͖ͪΜͱߟ͑Α͏ » JavaScriptΛॻ͘ྔ͕૿͖͑ͯͨ » ੲʮແཧΓੜ͖ͯΔJavaScriptʯ͕·Εͨ »
ࠓͦ͏Ͱͳ͍ɺJSͰΞϓϦέʔγϣϯΛߏங͢Δ » ৭ʑͳࡦΛଧͪɺ҆શͳJavaScriptΛॻ͜͏ʂ
Thank you for listening!