TypeScriptの型まとめ！安全で保守性の高いコードを書く方法

1. TypeScriptの「型（Type）」とは？

1. TypeScriptの「型（Type）」とは？

TypeScript（タイプスクリプト）は、JavaScriptに「型」という仕組みを追加したプログラミング言語です。型（type）とは、変数や関数の中に入る値が「どんな種類のデータなのか」をあらかじめ示しておく目印のようなものです。

たとえば「これは数字」「これは文字」「これは true / false のどちらか」といった情報をコードに書いておくことで、使い方のミスに気づきやすくなります。人に例えるなら、「この箱にはリンゴしか入れません」とラベルを貼っておくようなイメージです。

型を使うことで、間違った代入や処理を早い段階で防げるため、結果的に安全で保守性（あとから直しやすい）の高いコードにつながります。

let count: number = 10;
// 数字しか入らないと決めているので、安心して使える

このように「何が入る変数なのか」を最初に決めておくのが、TypeScriptの型の基本的な考え方です。プログラミング未経験の方でも、ルールが見える分、コードを理解しやすくなります。

2. よく使う基本の型

2. よく使う基本の型

TypeScriptでよく使う基本的な型を紹介します。まずはこの5つをおさえましょう。型は「この変数には、この種類の値を入れます」という約束なので、最初はラベル付けだと思うと理解しやすいです。

• number型： 数値（たとえば 10 や 3.14）
• string型： 文字列（たとえば "こんにちは"）
• boolean型： 真偽値（true または false）
• undefined型： 値がまだ「定義されていない」状態
• null型： 意図的に「何もない」ことを表す

「numberとstringは何となく分かるけど、undefinedとnullが難しい…」となりがちなので、ここではまずよく見る型として名前と役割だけ押さえておけばOKです。細かい違いは、使っていくうちに自然と慣れていきます。

数値型（number）の例

let price: number = 1200;
// priceには数字だけを入れる、という意味

文字列型（string）の例

let message: string = "こんにちは！";
// messageには文字だけを入れる、という意味

真偽値型（boolean）の例

let isOpen: boolean = true;
// true/falseのどちらかだけを入れる、という意味

このように型を書いておくと、「ここは数値」「ここは文字列」と判断しやすくなり、コードの読み間違いも減ります。それぞれの使い方を見ていきましょう。

3. 型をつけるメリット

3. 型をつけるメリット

TypeScriptで型をつける一番のメリットは、「間違いに早く気づける」ことです。JavaScriptだと実行してみるまで気づきにくいミスでも、TypeScriptならコードを書いている時点で「それは違うよ」と教えてくれます。たとえば数値を入れるつもりの変数に文字列を入れようとした瞬間に、エラーとして表示されるイメージです。

もうひとつは、コードの意味がはっきりする点です。「この変数には何が入るのか」「この関数は何を受け取るのか」が型で見えるので、あとから読み返したときや、チーム開発で他の人が読んだときも理解しやすくなります。結果として、修正や追加もしやすくなり、保守性が上がります。

型によるエラーの防止例

let age: number = 25;

// もし間違って文字列を入れようとすると、TypeScriptがエラーで教えてくれる
// age = "二十五";

このように型は、プログラミング初心者にとっても「うっかりミス」を減らす助けになります。最初は少し面倒に感じても、慣れてくると“安心して書ける”感覚が出てきます。

4. 配列とオブジェクトにも型をつけよう

4. 配列とオブジェクトにも型をつけよう

TypeScriptの型は、1つの値を入れる変数だけでなく、配列（リスト）やオブジェクト（複数の情報をまとめたもの）にも付けられます。ここを押さえると、「中身がバラバラで混乱する」「どんなデータが入っているのか分からない」といった悩みが減り、読みやすいコードに近づきます。

配列は「同じ種類のデータが並ぶもの」なので、number[]のように書いて「数値だけの配列」と決められます。オブジェクトは「名前と年齢」などのように、項目ごとに型を決めておくのがポイントです。

配列の型（number[]）の例

let scores: number[] = [80, 90, 75];
// scoresには数字だけが入る配列、という意味

オブジェクトの型の例

let user: { name: string; age: number } = {
    name: "Taro",
    age: 30
};
// userの中では、nameは文字列、ageは数値、と決まっている

このように型を書いておくと、「配列に文字が混ざってしまった」「年齢に文字列を入れてしまった」といったミスを防ぎやすくなります。特にデータを扱う場面では、型があるだけで安心感がぐっと増します。

5. 型推論（かたすいろん）とは？

5. 型推論（かたすいろん）とは？

TypeScriptは、型推論という便利な機能を持っています。これは、明示的に型を書かなくても、代入された値から自動的に「これはこの型だな」と判断してくれる仕組みです。

型推論の例

let city = "Tokyo"; // 自動的にstring型と判断される

ただし、型を明確に書いた方が、より安全で他の人が読みやすいコードになります。

6. any型に注意しよう

6. any型に注意しよう

any型とは、「どんな型でもOKですよ」という意味の型です。便利なように見えますが、TypeScriptの安全性を無効にしてしまうため、基本的には使わないようにしましょう。

any型の例

let data: any = 100;
data = "文字列でもOK";

このように、値の型が自由すぎると、エラーを見逃してしまい、バグの原因になります。

7. 型を使って関数も安全に！

7. 型を使って関数も安全に！

TypeScriptでは、関数の引数（ひきすう）や戻り値（もどりち）にも型をつけることができます。

これにより、「この関数はどんなデータを受け取って、どんなデータを返すのか」が明確になります。

関数の型の例

function greet(name: string): string {
    return "こんにちは、" + name + "さん！";
}

まとめ

まとめ

ここまでの流れを振り返ると、タイプスクリプトの型という仕組みは、とても身近な考え方であることがよくわかります。はじめて学ぶ人にとって、専門的なことばや記号が並んでいるとむずかしそうに見えますが、実際には、ひとつひとつの意味がはっきりしているので、すぐになじむことができます。たとえば、数字には数字という型、文字には文字という型があり、それぞれの型がきちんと守られることで、あとから読んだときにも迷うことがなく、まちがいも起こりにくくなります。とくに複数人で作業をする場面では、小さな見落としが大きな不具合へつながることがあるため、型を使うことで安心して読みやすい設計ができます。ひとりで作業をするときでも、しばらく時間がたってから見直したときに、ひとことの注釈があるかのように動作の意図が理解しやすくなるので、とても役に立つ考え方です。 さらに、配列やオブジェクトにも型を与えられるという点は、初心者にとっておどろきがあるところです。数字の集まりには数字の型、文字の集まりには文字の型を決めておくことで、どのような値が入っているのかがはっきりし、うっかり別の種類をまぜてしまうまちがいを防げます。ひとつの名前と年齢を持つ利用者の情報なども、型の形にそって整えれば、手帳のようにきれいに整理された状態で扱えます。そのうえ、関数にも型をつけることで、受け取る値、返す値がどんな種類なのかを決められるので、予想外の動作が起こる心配も少なくなります。 また、書かずにまかせることができる型推論という考え方は、便利な相棒のような存在です。すべてを細かく書かなくてもよい場面があり、すなおに記述するだけで、それにふさわしい型を推測してくれます。ただし、あらゆる型を許してしまう形にしてしまうと、数字と文字が混ざってしまう事態もおきるため、なんでも入れられる型に頼りすぎない意識が大切です。しっかりと型を考えたうえでコードを書くことで、後悔しないコードに近づきます。 もうひとつ見逃せない考え方として、コードの意図が読みやすくなるという点があります。読み手が数人いれば数人それぞれの考え方があり、書き手が少しでも迷わないように、変数や関数の意味を明確にしておく必要があります。そこで、型があると説明書のようにふるまってくれます。扱う値の性質を目で見てわかる形で残してくれるため、書いた本人だけでなく、あとから読む人にも親切な記述になります。 さらに、複雑な構造を持ったコードになるほど、その価値は大きくなります。複数の処理や複雑な結果を扱う場面では、ひとつの見落としが全体の流れに影響します。そうした場面でも、型がきちんと働くことで、何がどこに入り、どのように処理されていくのかが目で追いやすくなり、安心して作業が進められます。数字だけの配列、文字だけの配列、複数の値をまとめた形、呼び出されたデータの受け渡し、それぞれが順序よく正しく動くことで、信頼できるコードになります。 こうして振り返ると、型があることで、まちがいを防ぐ、読みやすくなる、流れがはっきり見えるなど、多くの良い点があることが伝わってきます。少しずつ意識して書くことで、慣れたころには自然と型がある書き方が身についていきます。気がつけば、手元のコードがすっきり整理され、どこにどの値が入り、どう扱われているかが一目でわかる形になっていきます。はじめのうちは丁寧に型を書く習慣を身につけ、小さな配列や簡単な関数から取り入れて、少しずつ理解を深めていくとよいでしょう。それが積み重なり、より安全で安心して読めるコードへと成長していきます。

かんたんなサンプル例

// 名前と年齢を持つ利用者情報
type User = {
    name: string;
    age: number;
};

// 挨拶を返す関数
function hello(u: User): string {
    return "こんにちは" + u.name + "さん";
}

const user: User = { name: "たろう", age: 20 };
// ここで返ってくる値は必ず文字列になる
console.log(hello(user));

この記事を読んだ人からの質問

この記事を読んだ人からの質問

プログラミング初心者からのよくある疑問／質問を解決します

TypeScriptの「型」って具体的に何を意味していますか？

TypeScriptにおける「型」とは、変数や関数にどんな種類のデータが入るのかを示すものです。たとえば、数字なのか文字なのか、あるいは真偽値かを明確にします。これにより、プログラムが安全になり、間違いを早期に発見できます。