以下のコードを見てください。
let foo = "foo";
if (foo) console.log("bar"); // => "bar"
foo = null;
if (foo) console.log("bar"); // => 出力なし
foo = "foo";
console.log(foo && foo.length === 3); // => true
foo = null;
console.log(foo && foo.length === 3); // => null
最後の行は false を期待していたのですが、null が表示されます。
どういうことか
論理演算子 - JavaScript | MDN より引用：
しかし、&& および || 演算子は、実際には、指定された演算対象の一方を返します。ですから、それらの演算子が、真偽値ではない値とともに用いられた場合、真偽値ではない値を返す可能性があります。
なるほど。つまり、null && null.length === 3 は、null が false とみなされて右側は評価されず、しかし実際には false ではなくその値自体を返すため null が返される、ということです。
期待通りに動かすには
以下のようにします。
console.log(foo !== null && foo.length === 3);
まとめ
if (foo) {} とか foo && foo.length とかは使わずに、比較演算子を用いて厳密に比較しましょう。falsy な値は null や undefined だけではなく、"" や NaN なども
当てはまります。特に "" は比較演算子を用いて評価しないと予期せぬ動作になるケースが多そうです。