【TypeScript】 メソッドの返り値が undefined である可能性を含む場合、型の絞り込みが効かない

  • SmartBee

最終更新⽇:

掲載⽇:

SmartBeeでは新機能開発のほか、大規模開発に向けた言語の移行も視野に入れ検討を進めています。
そのような中で起きた開発メモを残しておきたいと思います。

■ 問題のコード

```typescript
const test = (): string | undefined => {
return "hello"
}

if (test() !== undefined){
test().length // エラー
}

```

プロパティシグネチャが`undefined`を含みますが、
メソッド自体は必ず`string`を返しますし、
`if`文の前に`undefined`のチェックも行っています。

それなのになぜエラーが出るのでしょうか?

■ なぜこうなる?

これは、型の絞り込みは、変数にしか行われないためです。 メソッドの返り値は、型の絞り込みには使用できません。
以下のように変更してみたらどうでしょうか?

```typescript
let cnt = 0
const test = (): string | undefined => {
if (cnt > 1){
return undefined
}
cnt = cnt + 1
return "hello"
}

if (test() !== undefined){
test().length // エラー
}

```

このコードを型チェックを無効にして実際に動かしてみると、
実行時にエラーが発生します。
これは、`test()`が副作用を持つメソッドであり、呼ぶために実行結果が変わるためです。
これでは型の絞り込みが意味がありません。

■ どうする?

型の絞り込みは変数にしか効きません。
なので、実行結果を変数に入れてやります。

```typescript
const test = (): string | undefined => {
return "hello"
}

const testResult = test() // ここではまだundefinedの絞り込みはされてない

if (testResult !== undefined){ // ここでundefinedの可能性を除外
testResult.length // 5
}

```

これで無事に通ります。