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
1k
Other Decks in Programming
See All in Programming
htmxって知っていますか?次世代のHTML
hiro_ghap1
0
330
わたしの星のままで一番星になる ~ 出産を機にSIerからEC事業会社に転職した話 ~
kimura_m_29
0
180
create_tableをしただけなのに〜囚われのuuid編〜
daisukeshinoku
0
240
テストコード文化を0から作り、変化し続けた組織
kazatohiei
2
1.5k
開発者とQAの越境で自動テストが増える開発プロセスを実現する
92thunder
1
180
数十万行のプロジェクトを Scala 2から3に完全移行した
xuwei_k
0
270
Recoilを剥がしている話
kirik
5
6.6k
CSC305 Lecture 26
javiergs
PRO
0
140
なまけものオバケたち -PHP 8.4 に入った新機能の紹介-
tanakahisateru
1
120
CQRS+ES の力を使って効果を感じる / Feel the effects of using the power of CQRS+ES
seike460
PRO
0
120
ブラウザ単体でmp4書き出すまで - muddy-web - 2024-12
yue4u
2
460
103 Early Hints
sugi_0000
1
230
Featured
See All Featured
What's in a price? How to price your products and services
michaelherold
243
12k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
330
21k
Building Applications with DynamoDB
mza
91
6.1k
A Modern Web Designer's Workflow
chriscoyier
693
190k
It's Worth the Effort
3n
183
28k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
229
52k
A Philosophy of Restraint
colly
203
16k
BBQ
matthewcrist
85
9.4k
Writing Fast Ruby
sferik
628
61k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
28
2.1k
Put a Button on it: Removing Barriers to Going Fast.
kastner
59
3.6k
A Tale of Four Properties
chriscoyier
157
23k
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!