search
LoginSignup
1

More than 1 year has passed since last update.

posted at

updated at

JavaScript(TypeScript)の論理判定のベストプラクティスを考える

結論からいうと

  • Truthy/Falsyは絶対利用しない(必ずif (変数 === undefined)のように書く)
  • if (変数 === undefined || 変数 === null)といちいち書くのはやばいので、nullは利用しない
  • 外部APIとの接続でnullが必要な場合は、必ずラッパーに閉じ込める。ラッパーの外にnullを持ち出さない。
  • Lintで設定しよう

Truthy/Falsyを使いたくない

こうやって書きたい時、よくありますね。


const user = getUser();
if (user){
    // userが存在する場合の処理
}

ぼくも上のように書いてたんですが、JavaScript/TypeScriptのTruthy/Falsyの仕様上バグりやすすぎるのでやめることにしました。

JavaScript(TypeScriptも)のTruth/Falsyが罠

上のケース、userがobjectなら(普通ならそうのはず)問題ないけど、stringnumberだったらまずい。

TypeScriptでuser: Userと書いたところでそれは保証できない。type User = stringかもしれないし。

それに、「stringnumber以外ならTruthy/Falsyを利用してもよい」という運用は複雑でよくなさそう。

Truth/Falsyは、常に利用しない

if (user) -> if (user !== undefined)
if (!user) -> if (user === undefined)

と書き換えるのが結局ベストプラクティスとおもう。

nullだったらどうする?

nullundefinedが混在してるコードでは、こう書かなきゃいけない。

if (user) -> if (user !== undefined && user !== null)
if (!user) -> if (user === undefined || user === null)

これは
- 見た目きたねえ
- 書くのだるい
- いつかミスる

ので絶対やめたほうがよさそう。

if (user) -> if (user != undefined)
if (!user) -> if (user == undefined)

とすればnullもみてくれるが、==は一律で禁止したいので却下。(仮にここだけ==を利用する運用にした場合、ミスって===と書くかもだし、そもそも誰かが(未来の自分含め)「あ、ここ==使ってんじゃん。だめだめ、===に修正、っと」としうる。ミスに見えうる書き方はだめってダグラス・クロックフォードもいってた。)

null、やめよう。

そもそもnullを使うメリットってあるのか?

  • undefinedだと「まだ定義してない」と「明示的にない」の区別がつかないじゃないか!
    • -> それを区別してどうしたいのか?仮にしたいなら、そんな曖昧な方法じゃなくてもっと明確に用意すべきじゃないか?

このへんの議論はまあいろいろあるので、興味あればこちらなど。
https://media-massage.net/blog/javascript-typescript%E3%81%A7null%E3%82%92%E4%BD%BF%E3%81%86%E3%81%B9%E3%81%8D%E3%81%AA%E3%81%AE%E3%81%8B/

null使わない派
https://typescript-jp.gitbook.io/deep-dive/recap/null-undefined

ということで、undefined統一した。もし問題がでたらまた考える。

ESLintで設定する

こういうのはLintで機械的にみてほしい。

ESLint - no-null <- 言及してるイシュー
ESLint - strict-boolean-expressions

TSlintなら
TSLint - strict-boolean-expressions
no-nullは探してない

課題感

とはいえ毎回if (arg !== undefined)はごちゃつくから簡単にかけるリテラルがほしいなあ。

あと、外部APIのためのラッパーではどうしてもnullを使う必要があるけど、(試してないけど)no-nullでそこはいいかんじに除外できるんかな?

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
1