ES2020 Optional Chaining
2020-06-30
2020-06-30
今日はES2020の新機能を紹介
お久しぶりです。バジルだわんです。今回はES2020で、弊社的に嬉しい変更を紹介したいと思います。
変更点の詳細などは「ES2020」を御覧ください。
```
const myData = {
name: "バジル",
address: {
state: "福岡",
}
}
console.log(myData.address.state);
```
上記はちゃんと「福岡」と表示されます。
しかしながら下の場合。
```
const myData = {
name: "バジル",
}
console.log(myData.address.state);
```
この場合、そもそもmyData.addressが存在しないため、エラーとなってしまいます。
エラーとならないようにするには、こうする必要があります。
```
const myData = {
name: "バジル",
address: {
state: "福岡",
}
}
console.log(myData.address &&myData.address.state);
```
こうすると、addressがない場合はundefined、addressがある場合は「福岡」が表示されるようになります。
でも、長くてあんまり書きたくないですよね。
これを解決してくれるのがこれ。
```
const myData = {
name: "バジル",
address: {
state: "福岡",
}
}
console.log(myData.address?.state);
```
ありがたいです。見やすいです!
私からは以上です。