Skip to content

TypeScriptの基本

公開日:November 16, 2024更新日:November 28, 2024
JavaScriptTypeScriptCoding📄

TypeScriptでは、型システムを使ってコードをより堅牢にし、予測しやすくすることができます。このセクションでは、変数の宣言方法、型注釈、そしてTypeScriptで利用できる基本的なデータ型について学びます。

変数と型注釈

TypeScriptでは、変数を宣言する際に型を明示的に指定することができます。これを「型注釈」と呼びます。型を注釈することで、その変数に格納できるデータの種類が決まり、誤ったデータの代入を防ぐことができます。

typescript
let message: string = "Hello, TypeScript!";
let age: number = 30;
let isStudent: boolean = true;

上記の例では、messageは文字列(string)、ageは数値(number)、isStudentは真偽値(boolean)として型が注釈されています。

基本的なデータ型

TypeScriptでは、JavaScriptの基本的なデータ型に加えていくつか独自の型が用意されています。以下に代表的なデータ型を紹介します。

  1. 数値型(number

    • 整数や浮動小数点数を扱うための型です。
    typescript
    let price: number = 1500;
  2. 文字列型(string

    • 文字列を扱うための型です。文字列はダブルクォート(")またはシングルクォート(')で囲みます。
    typescript
    let name: string = "Alice";
  3. ブール型(boolean

    • 真(true)または偽(false)を扱うための型です。
    typescript
    let isLoggedIn: boolean = false;
  4. 配列型(Array

    • 同じ型のデータの集合を扱うための型です。配列の型はtype[]またはArray<type>で表します。
    typescript
    let numbers: number[] = [1, 2, 3, 4, 5];
    let colors: Array<string> = ["red", "green", "blue"];
  5. タプル型([type1, type2, ...]

    • 異なる型のデータを固定の順序で扱うための型です。各要素の型を定義できます。
    typescript
    let person: [string, number] = ["Bob", 25];
  6. 列挙型(enum

    • 特定の定義された値の集合を扱うための型です。列挙型を使うことで、より読みやすく、安全なコードを書けます。
    typescript
    enum Color {
      Red,
      Green,
      Blue
    }
    let favoriteColor: Color = Color.Green;

型推論と型注釈の使い分け

TypeScriptには「型推論」という機能があり、変数の初期値から自動的にその型を推測します。つまり、型注釈を明示的に指定しなくても、TypeScriptは適切な型を割り当てることができます。

typescript
let count = 10;  // 型推論により `count` は `number` 型になる
let greeting = "Hello!";  // 型推論により `greeting` は `string` 型になる

上記の例では、countnumber型、greetingstring型としてTypeScriptが自動的に判断します。型推論を利用することでコードを簡潔に書くことができますが、コードの可読性や誤ったデータの代入を避けたい場合には、明示的に型注釈を使用することが推奨されます。

例えば、関数の引数や戻り値に型注釈を付けることで、その関数がどのようなデータを受け取り、返すのかを明確にできます。

typescript
function add(a: number, b: number): number {
  return a + b;
}

このように、型推論と型注釈をうまく使い分けることで、より安全で保守しやすいコードを書くことができます。