JavaScriptにおける`truthy`と`falsy`
この記事ではJavaScriptにおけるtruthyとfalsyについて説明します。
YouTube Video
JavaScriptにおけるtruthyとfalsy
JavaScriptにおけるtruthyとfalsyの概念は、特に条件式での評価において非常に重要な役割を果たします。truthyとfalsyは、値が真(true)または偽(false)として評価されるかどうかを決定しますが、これらの値は必ずしもブール型のtrueやfalseそのものではありません。
falsyの値
falsyの値は、JavaScriptの条件式においてfalseとして評価される値を指します。以下は、JavaScriptにおけるfalsyな値のリストです。
1const values = [
2 false,
3 0,
4 -0,
5 0.0,
6 -0.0,
7 0n,
8 -0n,
9 "",
10 null,
11 undefined,
12 NaN
13];
14
15for (let value of values) {
16 if (value) {
17 console.log(`${value} is truthy`);
18 } else {
19 console.log(`${value} is falsy`);
20 }
21}この例では、falsyな値はすべて「falsy」として出力されます。以下は、JavaScriptにおけるfalsyな値のリストです。
false— ブール型のfalse0— 数値のゼロ(小数の0.0も同様にfalsyです)-0— 負のゼロ(技術的には0と区別されますが、同様にfalsyです)0n— BigInt型のゼロ""— 長さ0の空文字列null— 値が存在しないundefined— 未定義の値NaN— 数値でない値
これらの値は、論理演算や条件分岐(if文など)でfalseとして扱われます。
truthyの値
falsyでない値はすべてtruthyです。これは、ブール型のtrueとして評価される値を指します。JavaScriptでは、多くの値がtruthyとして扱われます。
1const values = [
2 true,
3 1,
4 -1,
5 "Hello",
6 " ",
7 [],
8 {},
9 function() {},
10 Symbol(),
11 Infinity
12];
13
14for (let value of values) {
15 if (value) {
16 console.log(value, ' is truthy');
17 } else {
18 console.log(value, ' is falsy');
19 }
20}このコードでは、truthyな値が「truthy」として出力されます。例えば、次のような値がtruthyです。
true— ブール型のtrue- 数値(0以外) — 例えば
1や-1もtruthyです。 - 文字列(空でないもの) — 例えば
"Hello"や" "(空白のみの文字列でもtruthyです) - オブジェクト — 空のオブジェクト(
{})や配列([])もtruthyです。 - 関数 — 関数自体も
truthyです。 Symbol—Symbol型の値もtruthyです。Infinity— 正および負の無限大もtruthyです。
truthyとfalsyの応用
truthyやfalsyの概念は、条件式や論理演算でしばしば使用されます。例えば、||(論理OR)演算子を使ってデフォルト値を設定する場合、最初のtruthyな値が結果として返されます。
falsyな値の確認方法
falsyな値を確認するには、Boolean関数を使うと便利です。Boolean関数は、与えられた値を明示的にブール型に変換します。
Boolean関数の例
1const values = [
2 false,
3 0,
4 "",
5 null,
6 undefined,
7 NaN
8];
9
10for (let value of values) {
11 console.log(`${value} is ${Boolean(value) ? 'truthy' : 'falsy'}`);
12}結論
JavaScriptにおけるtruthyとfalsyは、ブール型ではない値を条件式でどのように評価するかを理解するために重要です。falsyな値にはfalse、0、空文字列、null、undefined、NaNなどがありますが、それ以外の値はすべてtruthyとして評価されます。これらの概念を理解することで、より柔軟で効率的なコードを書くことができるようになります。
YouTubeチャンネルでは、Visual Studio Codeを用いて上記の記事を見ながら確認できます。 ぜひYouTubeチャンネルもご覧ください。