2022.02.26 2024.05.11

TypeScriptの型まとめ

hebishima.shogo

はい、hebiです。

JavaScriptと違ってTypeScriptでは型を定義する必要があります。
Webで見つけたJavaScriptのソースコードをTypeScriptに適用すると、ほぼほぼ型の未定義によるコンパイルエラーが発生するのではないでしょうか。

「型を制するものはTypeScriptを制す！！」と思っており(どこかで聞いたフレーズ。。)
今回の記事ではTypeScriptで使う主要な型についてまとめました。

Contents

型
最後に

型

any

anyを使うとJavaScriptと同じような振る舞いになるため、型チェッカーの効果を発揮しないためバグにつながります。最後の手段のみで利用しましょう。

let a: any = 1      // any
let b: any = 'test' // any
let c = a + b       // any

3番目のc変数の代入はコンパイルエラーになってほしいとことですが、エラーになりません。
実行して初めてエラーになります。
このようにany型は気づかないところでバグを生んでしまうので利用しないようにしましょう。

unknown

anyに似ていますが、本当に型が分からない値がある場合にanyではなくunknownを利用します。

let a: unknown = 10 // unknown
let b = a === 11    // boolean
let c = a + 10      // エラー
if (typeof a === 'number')
{
    let d = a + 10 // number
}

unknownは値の比較(==、===、||、&&、?)、否定(!)、typeofでの型の判定は可能ですが、計算等の演算は行えません。ただしtypeofで型を判定することで、判定した型での演算が可能となります。

boolean

booleanはtrue(真)とfalse(偽)を示す型です。

let a = true          // boolean
let b: boolean = true // boolean

boolean型は1行目のように型指定を行わなくてもTypeScriptに推論させることができます。
明示的に型を指定したい場合は2行目の書き方を行ってください。

number

numberは整数、浮動小数点、正数、負数、Infinity(無限大)、NaN(非数)など数値の集まりです。

let a = 10            // number
let b = number = 100  // number
let c = a < b         // boolean

booleanと同様に型指定を行わなくてもTypeScriptに推論させることができます。

string

stringは文字列の集まりです。

let a = 'hello'         // string
let b: string = 'world' // string
let c = a + b           // string

boolean、numberと同様に型指定を行わなくてもTypeScriptに推論させることができます。

型エイリアス

let、const、varで変数名を独自に宣言できるのと同じように、typeを使用することで型も独自に宣言することができます。

// Person型を宣言
type Person = {
    name: string
    age: number
}

// Person型を利用
let driver: Person = {
    name: 'hebi',
    age: 35
}

配列

配列もパターンがあります。

let a = [1, 2, 3]       // number[]
let b = ['a', 'b']      // string[]
let c: string[] = ['a'] // string[]
let d = [1, 'a']        // (string | number)[]
let e = []              // any[]
e.push(1)               // number[]
e.push('test')          // (string | number)[]

配列も型を指定しない場合TypeScriptの推論により配列の中に複数の型のデータが入ってしまいます。配列は必ず型を指定するようにしましょう。

列挙型

列挙型(enum)は、値を列挙します。

// 何も指定しない場合は0から数字が振られます
enum Animal {
    Dog,   // 0
    Cat,   // 1
    Rabbit // 2
}
// 任意の数字や文字列を割り当てることもできます
enum Animal2 {
    Dog = 'Dog',
    Cat = 'Cat',
    Rabbit = 'Rabbit'
}

let dog: Animal = Animal.Dog // 0
let dog2: Animal2 = Animal2.Dog // Dog