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
optional chainingの話
Search
yayoc
April 24, 2018
Programming
0
240
optional chainingの話
2018/04/24 Roppongi.js
yayoc
April 24, 2018
Tweet
Share
More Decks by yayoc
See All by yayoc
Proxy's Black Magic
yayoc
0
150
What I did to improve performance score on Lighthouse
yayoc
2
2.5k
Practical Flow Type
yayoc
1
670
Other Decks in Programming
See All in Programming
ビット演算の話 / Let's play with bit operations
kaityo256
PRO
3
150
Iteratorでページネーションを実現する
sonatard
3
700
フロントエンドの標準仕様をどう追っているか / How I follow the frontend standards specs
petamoriken
2
170
"noncopyable types" の使いどころについて考えてみた
andpad
0
130
ファーストペンギンBot @Qiita Hackathon 2024 予選
dyson_web
0
210
M5Stack に色々な M5ユニットをつないで扱う為の新たなアプローチ
gob
0
200
C#および.NETに対する誤解をひも解く
ymd65536
0
210
ACES Meet におけるリリース作業改善の取り組み
fukucheee
0
110
VS Code extension: ドラッグ&ドロップでファイルを並び替える
ttrace
0
150
Infrastructure as Code でセキュリティを楽にしよう!
konokenj
5
1.4k
Vue :: Better Testing 2024
up1
1
360
Micro Frontends for Java Microservices - dev2next 2024
mraible
PRO
0
180
Featured
See All Featured
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
26
2k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
225
22k
The Brand Is Dead. Long Live the Brand.
mthomps
53
38k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
504
140k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Building Applications with DynamoDB
mza
90
6k
Automating Front-end Workflow
addyosmani
1365
200k
Designing on Purpose - Digital PM Summit 2013
jponch
114
6.9k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
228
52k
Making Projects Easy
brettharned
114
5.8k
No one is an island. Learnings from fostering a developers community.
thoeni
19
2.9k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
1
240
Transcript
Optional chainingの話 Roppongi.js @yayoc
Hello! I am 弥吉修英 I am software engineer at Fast
Retailing. Twitter: @yayoc_ Github: @yayoc
なにをやっているか? ◦ SPAの実装 ◦ BFFの実装 ( 今日はここについての話など ) CDN router
SPA BFF Micro-service A Micro-service B Micro-service C Micro-service D
Micro serviceとの付き合い ◦ 10個以上のmicro serviceとREST APIでのやり取り ◦ APIがnullやundefinedを返すことはよくある □ データの不整合だったり・・
□ API仕様がPF間で若干違っていたり・・ □ バグだったり・・
結果、TypeError Cannot read propertyが頻出度の高いエラーであるという話 https://rollbar.com/blog/top-10-javascript-errors/ 肌感としてもよく分かる
解決策? 1. && operator 2. Ternary operator 3. Try catch
どれも冗長さが否めない・・
optional-chainingの proposal ◦ .? の左側を計算して、undefined もしくは nullの場合は、 undefinedを返す。そうでない場合は、素直にプロパティアク セスや関数実行を行う ◦
冗長な繰り返し記述やテンポラリな変数格納を避ける ◦ ステータスはStage1 ◦ Swift, C#などにはある ◦ https://tc39.github.io/proposal-optional-chaining/ ◦ TSにもまだない。( 議論は3年以上前からあるが・・ https://github.com/Microsoft/TypeScript/issues/16
optional-chain ◦ optional-chainというライブラリを作ってみた https://github.com/yayoc/optional-chain ◦ TSで書いたOption Typeを使った実装
optional-chain ◦ 間違ったプロパティアクセスに対しては、エラーを返す ◦ この辺の実装は@utatti氏のlens実装をかなり参考に
optional-chain ◦ パターンマッチ, getOrElseなどのAPIも一応ある
結論 ◦ JSにおける、プロパティアクセスは悩みのタネ ◦ optional chainingはスマートに解決してくれるので期待 ◦ optional-chainも解決してくれるかもしれない
THANKS! ありがとうございました。 Twitter: @yayoc_ Github: @yayoc
Appendix ◦ https://github.com/paypal/api-standards/blob/master /api-style-guide.md#null ◦ https://github.com/tc39/proposal-optional-chaining ◦ https://github.com/yayoc/optional-chain ◦ https://medium.com/@n_yayoshi/optional-chain-pro
xy-brings-optional-chaining-75fff102acbd ◦ https://developer.apple.com/library/content/docume ntation/Swift/Conceptual/Swift_Programming_Langu age/OptionalChaining.html
CREDITS Special thanks to all the people who made and
released these awesome resources for free: ◦ Presentation template by SlidesCarnival ◦ Photographs by Unsplash ◦ Backgrounds by SubtlePatterns