前回の記事では TypeScriptの環境構築 について解説しました。
TypeScriptを実際に使う準備ができたので、ここからは TypeScriptの型システムを学んでいきます。

この記事では次の内容を解説します。

• TypeScriptの基本型
• 型の書き方
• any型の注意点
• 型推論との関係

TypeScriptの型を理解することは、TypeScriptを使う上で最も重要なポイントの一つです。

---

型とは何か

プログラミングにおける「型」とは

データの種類

のことです。

例えば次のような値があります。

10
"Hello"
true

これらはそれぞれ

数値
文字列
真偽値

という異なる型を持っています。

JavaScriptでは、これらの型をあまり意識せずにプログラムを書くことができます。

しかし、JavaScriptでは次のような問題が起きることがあります。

let value = 10
value = "hello"

このコードはJavaScriptでは問題なく実行されます。

しかしプログラムの規模が大きくなると

• 予期しないデータ
• 想定外の型

が原因でバグが発生することがあります。

TypeScriptでは、この問題を防ぐために 型を明示的に指定できます。

---

string型

string型は 文字列 を表します。

例

let name: string = "Taro"

この場合

name

には文字列しか代入できません。

例えば次のコードはエラーになります。

name = 10

TypeScriptはコンパイル時にエラーを出します。

---

number型

number型は 数値 を表します。

let age: number = 20

JavaScriptでは

整数
小数

の区別はありません。

すべて

number

になります。

例

let price: number = 1000
let tax: number = 0.1

---

boolean型

boolean型は 真偽値 を表します。

let isAdmin: boolean = true

boolean型は次の2つの値のみです。

true
false

例

let isLogin: boolean = false

この型は

• ログイン状態
• フラグ
• UI状態

などに使われます。

---

null型

nullは 値が存在しない状態 を表します。

let value: null = null

実務では

null

は次のような場面で使われます。

• APIレスポンス
• 初期値
• データ未設定

---

undefined型

undefinedは 値が定義されていない状態 を表します。

let data: undefined = undefined

JavaScriptでは次のような場合にundefinedになります。

let value

または

function test() {}

戻り値がない場合などです。

---

any型

any型は

どんな型でも許可

する特殊な型です。

例

let value: any = "hello"
value = 10
value = true

どんな値でも代入できます。

---

any型の問題

any型を使うと

TypeScriptの型チェックが無効

になります。

例えば

let value: any = 10
value = "hello"

これはエラーになりません。

そのため実務では

anyはなるべく使わない

というルールが一般的です。

---

unknown型

anyと似た型として

unknown

があります。

let value: unknown = "hello"

unknown型は

型チェックが必要

という特徴があります。

例えば

let value: unknown = "hello"

if (typeof value === "string") {
  console.log(value.length)
}

このように型を確認してから使用します。

unknownは

安全なany

と考えると分かりやすいです。

---

型推論との関係

TypeScriptでは必ずしも型を書く必要はありません。

TypeScriptには 型推論 という仕組みがあります。

例

let age = 20

TypeScriptはこの値を見て

number

と判断します。

同様に

let name = "Taro"

は

string

になります。

そのため

let age: number = 20

のように書く必要がない場合もあります。

---

実務でよく使う型

実務で最もよく使う型は次の3つです。

string
number
boolean

これらは

• ユーザー名
• 商品価格
• 状態フラグ

など、あらゆる場面で使われます。

TypeScriptを使う場合はまず

基本型

を理解することが重要です。

---

まとめ

この記事では TypeScriptの基本型 を解説しました。

重要なポイントを整理します。

• TypeScriptでは型を指定できる
• 主な基本型は
• string
• number
• boolean
• any型は便利だが注意が必要
• unknown型は安全な型

基本型を理解すると、TypeScriptのコードが読みやすくなります。

---

次の記事

次回は

TypeScriptの型推論

を詳しく解説します。

型推論はTypeScriptの大きな特徴の一つで、

• 型を書かなくても安全
• コードがシンプル

というメリットがあります。