質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

Q&A

解決済

1回答

8483閲覧

Typescriptにおける戻り値がstring|nullの場合の処理

you_19000

総合スコア31

TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

0グッド

1クリップ

投稿2019/04/28 02:05

Typescriptの勉強をしています。
以下のコードの場合可読性やミス防止の観点ではどのように処理するべきでしょうか。
またこういったnullが返ってくる場合の処理方法としてより適切な方法があれば教えて頂けないでしょうか。

お手数ですが宜しくお願い致します。

Typescript

1 const check: string | null = "stringかnullを返す関数"; 2 if (check === null) { 3 Logger.log("返り値Null") 4 return; 5 } 6 // 以降nullでない場合やりたかった処理

typescript

1 if ("stringかnullを返す関数" === null) { 2 Logger.log("返り値Null") 3 return; 4 } 5 const val: string | null = "stringかnullを返す関数"; 6 // 以降nullでない場合やりたかった処理

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

tsconfig.jsonのcompilerOptionsで、strictNullChecksを true にした上で

typescript

1 const check: string | null = "stringかnullを返す関数"; 2 if (check === null) { 3 Logger.log("返り値Null") 4 return; 5 } 6 // 以降nullでない場合やりたかった処理

がベターだと思います。

通常、 null undefined は他のデータ型と区別されず、任意の型の変数に対して代入が可能です。
しかし strictNullChecks をtrueにすると null undefined は他のデータ型と明確に区別されるようになります。

typescript

1const str: string = 'str' // ←OK 2const str: string = null // ←NG 3const str: string = undefined // ←NG 4 5const str: string | null = 'str' // ←OK 6const str: string | null = null // ←OK 7const str: string | null = undefined // ←NG 8 9const str: string | undefined = 'str' // ←OK 10const str: string | undefined = null // ←NG 11const str: string | undefined = 'str' // ←OK

上記の場合、NGのケースは全てコンパイルエラーとなります。

また、 nullundefined の可能性がある変数に参照する場合は

typescript

1const str: string = 'str' 2const len: number = str.length // ←OK 3 4const str: string | null = getStringMayBeNull() 5const len: number = str.length // ←strはnullの可能性もあるのでNG 6 7const str: string | null = getStringMayBeNull() 8const len: number = str !== null ? str.length : 0 // ←strがnullでない(=string)の時だけ String#length にアクセスしているので、OK

のように、「 null undefined の可能性が排除されたケースでのみ参照可能」となります。
nullundefined の可能性が有る変数に、事前のガードを入れずそのプロパティを参照しようとしている場合はコンパイルエラーです。

投稿2019/04/28 09:57

philomagi

総合スコア267

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

you_19000

2019/04/28 10:28

大変ありがとうございます。大分すっきりしました。 ちなみに、頂いた例のうち、以下の箇所になりますが、 もしstr変数のstringの値そのものにアクセスしたい場合、以下で正しいでしょうか? 【頂いた箇所】 const str: string | null = getStringMayBeNull() const len: number = str !== null ? str.length : 0 【stringの値を取り出したい場合】 const str: string | null = getStringMayBeNull(); const val: string = str !== null ? str : 0; 度々お手数ですが宜しくお願い致します
philomagi

2019/04/28 20:21 編集

`str !== null ? str : 0;` だと、str === null の場合に評価される値はnumber型の0のなってしまうので、 `const val: string` には代入できませんね。`const val: string | number` になら代入できます。 最終的に文字列として扱うのであれば ``` const val: string = str || "" ``` ぐらいでどうでしょう? str === null の場合は "" が評価され、valには空文字が入ります。 「このケースでは、getStringMaybeNullは100%確実にstringを返す」という場合であれば ``` const str: string = getStringMaybeNull()! ``` と ! をつけることで、コンパイラに対して「この関数の戻り値はnullではない」と強制的に認識させることもできます(関数呼び出しの他、変数でも可能です) ただし、これを乱用するとnullチェックを有効にした意味が無くなるので、原則使わない方が良いです。
you_19000

2019/04/29 00:44

ありがとうございます! お陰様でスッキリしました 解決致しました
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問