やあ。TypeScriptの世界へようこそ。
フロントエンドの最前線でコードを書いて10年、数え切れないほどのバグと戦ってきた僕から、まずは一番シンプルで、でも実は奥が深い「boolean(ブーリアン)」という型についてお話しするよ。
「たかが真偽値、trueかfalseでしょ?」と思うかもしれない。でも、ここを丁寧に積み上げるかどうかで、将来あなたが書くコードの「堅牢さ」がまるで変わってくるんだ。肩の力を抜いて、一緒に見ていこう。
—
1. boolean型ってなんだろう?:スイッチのイメージ
boolean型は、プログラミングにおける「ONかOFFか」を決めるスイッチだと思っていい。
例えば、Webサイトでよくある「ダークモードの切り替えスイッチ」。あれを想像してみて。
- スイッチがONなら、画面は黒くなる(true)
- スイッチがOFFなら、画面は白くなる(false)
TypeScriptの世界では、この「true(真)」と「false(偽)」しか入れられない箱を「boolean型」と呼んでいるんだ。
// ダークモード設定の例
let isDarkMode: boolean = true; // 最初はONにしておこう
isDarkMode = false; // あとからOFFに変えることもできるよ
// もしここに数値や文字列を入れようとすると…?
// isDarkMode = “ON”; // これはエラー!TypeScriptが「それ、booleanじゃないよ!」と教えてくれる
このように、「意図しないデータが入り込むのを防ぐ」こと。これがTypeScriptの最大の恩恵であり、君のコードを守る盾になるんだ。
—
2. 実はもっとわがままな「リテラル型」の話
さて、ここからが少し面白いところだよ。
TypeScriptには、ただのbooleanよりも「もっと厳格なやつ」がいる。それが「リテラル型」だ。
さっきの例で、`let isDarkMode: boolean = true;` と書いたよね。これは「trueかfalseなら何でもいいよ」という広い許可証を持っている状態だ。でも、「いや、この変数は絶対にtrueじゃないと困るんだ!」というケースがたまにある。
そんな時は、型に直接 `true` と書いてしまうんだ。
// この変数は「true」という値しか受け付けない!
let mustBeTrue: true = true;
// mustBeTrue = false; // エラー!「falseはtrueという型に割り当てられないよ」と怒られる
「え、わざわざそんなことするの?」と思うだろう? 現場ではね、関数の引数で「このフラグは必ずONの状態で実行してほしい」といった、プログラムのルールを強制したいときにこのテクニックが光るんだ。今は「こんな書き方もあるんだな」と頭の片隅に置いておいてくれれば十分だよ。
—
3. 条件分岐での「型ガード」:賢い相棒
TypeScriptが本当に頼りになるのは、`if` 文の中にいる時だ。
例えば、サーバーから返ってきたデータの中に「ユーザーが有料会員かどうか」を示す値があるとしよう。
function checkMembership(isPremium: boolean) {
if (isPremium) {
// ここに入った時点で、TypeScriptは isPremium が絶対に「true」だと分かっている
console.log(“有料プランの特典を表示します”);
} else {
// ここに入った時点で、絶対に「false」だと分かっている
console.log(“無料プランの画面を表示します”);
}
}
この「分かっている」というのが重要なんだ。
もしJavaScriptだけで書いていたら、「本当にisPremiumは値が入っているかな? nullじゃないかな?」と不安になりながらコードを書くことになる。でもTypeScriptは、boolean型として定義された時点で「こいつは絶対にtrueかfalseのどちらかだ」と確信してくれている。
おかげで、僕たちは「値が存在するかどうかの確認」という無駄な心配から解放されるわけだ。これこそが、開発効率を爆上げする秘密だよ。
—
4. 初学者がつまずきやすいポイント: truthy(トゥルーシー)な値
最後に、これだけは覚えておいてほしい「落とし穴」があるんだ。
JavaScriptには、boolean型じゃないのに `if` 文で「true扱い」されるやつらがいる。これを「truthyな値」と呼ぶんだ。
例えば、数字の `1` や、文字が入っている `string` は、`if` 文に入れると `true` として扱われる。
const username = “TypeScriptマスター”;
if (username) {
// 文字列は “truthy” なので、ここが実行される
console.log(“名前があるね!”);
}
初心者の頃は、この「boolean型じゃないのにbooleanとして振る舞う」挙動で混乱しがちだ。「TypeScriptで型を定義するなら、できるだけboolean型を明示的に使う」ことを意識してほしい。
`if (username)` と書くより、`if (username.length > 0)` と書いたほうが、君の意図が明確になるし、バグも減る。コードは「誰が読んでも迷わない」のが一番かっこいいんだ。
—
最後に
boolean型は、TypeScriptという広大な冒険の「最初の足がかり」だ。
最初は窮屈に感じるかもしれない。「なんでいちいち型なんて書かなきゃいけないんだ?」ってね。でも、その小さな規律が、数ヶ月後の君を救うことになる。
大丈夫、少しずつ慣れていこう。エディタを開いて、自分で `boolean` を使った変数を作ってみることから始めてみて。何かエラーが出たら、それはTypeScriptという相棒が君を助けようとしてくれている合図だからね。
またいつでも聞きに来てくれ。次はもっと深い、面白い話をしよう。

コメント