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
TypeScript で Optional Chaining を使ってみた
Search
Masaki Koyanagi
October 25, 2019
Programming
1
730
TypeScript で Optional Chaining を使ってみた
WeJS @ 37th
https://wajs.connpass.com/event/150356/
Masaki Koyanagi
October 25, 2019
Tweet
Share
More Decks by Masaki Koyanagi
See All by Masaki Koyanagi
Vitestを使った型テストの始め方
mascii
6
2.8k
WebHID API でリングコン のセンサー値を取得してみた
mascii
1
1k
Pros and Cons で考える Vue 2 Composition API
mascii
4
1.1k
Joy-ConをJavaScriptでプレゼンリモコンにした話
mascii
0
550
Vue.jsでCSS Modulesを使ってみた
mascii
0
140
不変量
mascii
1
170
Nuxt.js+Firebaseで個人サービスを作るまで
mascii
1
2.4k
JavaScriptのバージョンの話
mascii
1
2.2k
あなたのお家に眠るラズパイを救出したい
mascii
4
3k
Other Decks in Programming
See All in Programming
Julia という言語について (FP in Julia « SIDE: F ») for 関数型まつり2025
antimon2
3
820
プロダクト開発でも使おう 関数のオーバーロード
yoiwamoto
0
130
ワンバイナリWebサービスのススメ
mackee
10
7.7k
実はすごいスピードで進化しているCSS
hayato_yokoyama
0
100
REST API設計の実践 – ベストプラクティスとその落とし穴
kentaroutakeda
2
350
Passkeys for Java Developers
ynojima
2
800
eBPFを用いたAIネットワーク監視システム論文の実装 / eBPF Japan Meetup #4
yuukit
3
720
💎 My RubyKaigi Effect in 2025: Top Ruby Companies 🌐
yasulab
PRO
1
130
コード書くの好きな人向けAIコーディング活用tips #orestudy
77web
3
260
レガシーシステムの機能調査・開発におけるAI利活用
takuya_ohtonari
0
520
KotlinConf 2025 現地で感じたServer-Side Kotlin
n_takehata
1
140
Prism.parseで 300本以上あるエンドポイントに 接続できる権限の一覧表を作ってみた
hatsu38
1
110
Featured
See All Featured
How to train your dragon (web standard)
notwaldorf
92
6.1k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
20
1.3k
Measuring & Analyzing Core Web Vitals
bluesmoon
7
470
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
47
2.8k
A designer walks into a library…
pauljervisheath
205
24k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
45
9.6k
Statistics for Hackers
jakevdp
799
220k
Code Review Best Practice
trishagee
68
18k
What’s in a name? Adding method to the madness
productmarketing
PRO
22
3.5k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.8k
VelocityConf: Rendering Performance Case Studies
addyosmani
329
24k
Transcript
None
• • •
• •
None
const user1 = { age: 26, driverLicense: { expirationDate: '2023/01/22'
}, } const user2 = { age: 12, driverLicense: null, } user1.driverLicense.expirationDate // '2023/01/22' user2.driverLicense.expirationDate // TypeError: Cannot read property 'expirationDate' of null
•
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Optional_chaining
const user1 = { age: 26, driverLicense: { expirationDate: '2023/01/22'
}, } const user2 = { age: 12, driverLicense: null, } user1.driverLicense?.expirationDate // '2023/01/22' user2.driverLicense?.expirationDate // undefined
• let expirationDate if (user.driverLicense) { expirationDate = user.driverLicense.expirationDate }
None
None
• ◦ https://devblogs.microsoft.com/typescript/announcing-typescript-3-7-rc/
https://devblogs.microsoft.com/typescript/ announcing-typescript-3-7-rc/ http://www.typescriptlang.org/play/
• "use strict"; var _a, _b; const foo = {
bar: null }; // foo?.bar?.baz (_b = (_a = foo) === null || _a === void 0 ? void 0 : _a.bar) === null || _b === void 0 ? void 0 : _b.baz;
• • const foo = { items: ['Pen', 'Pineapple', 'Apple'],
get bar() { console.count('bar!'); return { baz: this.items.join() }; } } foo?.bar?.baz // bar!: 1 // 'Pen,Pineapple,Apple' foo && foo.bar && foo.bar.baz // bar!: 2 // bar!: 3 // 'Pen,Pineapple,Apple'
• • $ npm i typescript@rc ts-node $ npx ts-node
None