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
630
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
5
2.4k
WebHID API でリングコン のセンサー値を取得してみた
mascii
1
880
Pros and Cons で考える Vue 2 Composition API
mascii
4
940
Joy-ConをJavaScriptでプレゼンリモコンにした話
mascii
0
450
Vue.jsでCSS Modulesを使ってみた
mascii
0
120
不変量
mascii
1
110
Nuxt.js+Firebaseで個人サービスを作るまで
mascii
1
2.1k
JavaScriptのバージョンの話
mascii
1
2k
あなたのお家に眠るラズパイを救出したい
mascii
4
2.9k
Other Decks in Programming
See All in Programming
유연한 Composable 설계
l2hyunwoo
0
380
MIERUNE BBQにおけるユーザー中心設計()
mierune
PRO
1
110
社内 LT 会を発足し、アウトプット文化を醸成させるために考えたこと・やったこと / Starting internal LT meetings and fostering an output culture
mackey0225
3
120
はしめてのプログラミングとロボット制御
watawatavoltage
0
290
Advanced App Shrinking Techniques
cbeyls
2
150
Webエディタライブラリ 「CodeMirror」から学ぶ Webアプリ開発のテクニック
ryosukeigarashi
0
250
Trial
cairolibrary720
1
130
Harnessing Large Language Models for Training-free Video Anomaly Detection
tereka114
1
1.3k
ピグパーティにおけるMongoDB CommunityバージョンからAtlasへの移行事例
10969hotaka
0
130
AWSでゲームサーバーを運用! Amazon GameLiftのお話
iriikeita
0
200
さきがけから振り返るアーキテクチャ刷新 / Reflecting on the Architectural Renewal from the Vanguard
nrslib
2
780
Android開発者のための Kotlin Multiplatform入門
ntaro
0
190
Featured
See All Featured
A Modern Web Designer's Workflow
chriscoyier
689
190k
The Power of CSS Pseudo Elements
geoffreycrofte
64
5.2k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
36
9.1k
Build The Right Thing And Hit Your Dates
maggiecrowley
28
2.2k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
277
13k
Rebuilding a faster, lazier Slack
samanthasiow
78
8.5k
The Brand Is Dead. Long Live the Brand.
mthomps
52
36k
Rails Girls Zürich Keynote
gr2m
93
13k
Building a Scalable Design System with Sketch
lauravandoore
458
32k
Designing the Hi-DPI Web
ddemaree
276
34k
Web development in the modern age
philhawksworth
203
10k
Building Better People: How to give real-time feedback that sticks.
wjessup
357
18k
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