リテラル型｜コードで実践

値そのものを型として書く

型名の代わりに、値をそのまま書けます。

let category: "web";

category = "web";
category = "design";
// エラー Type '"design"' is not assignable to type '"web"'.

"web" という型は、"web" という文字列 1 つだけを許す型です。これをリテラル型と呼びます。リテラルとは、コードに直接書いた値そのもののことです。

これだけだと使い道がありませんが、前回の union と組み合わせると一気に実用になります。

union にすると選択肢の一覧になる

ゆめさくの作品には、カテゴリが 3 つあります。Web 制作、デザイン、ライティングの 3 つです。これを string で持つと、こう書けてしまいます。

let category: string = "desgin";

打ち間違いですが、string から見れば立派な文字列なので何も起きません。表示のときになって初めて、どのカテゴリにも当てはまらないと気づきます。

リテラル型を union で並べると、選べる値そのものを型にできます。

type WorkCategory = "web" | "design" | "writing";

let category: WorkCategory = "design";

category = "desgin";
// エラー Type '"desgin"' is not assignable to type 'WorkCategory'.

打ち間違いが、実行する前に止まりました。

エディタが候補を出してくれる

もう 1 つの効果があります。WorkCategory の値を書こうとすると、エディタが "web" "design" "writing" を候補として出します。

function setCategory(category: WorkCategory): void {
  console.log(category);
}

setCategory("writing");

何を渡せばよいかを覚えておく必要がなくなります。型が仕様書の役をしてくれる、というのはこういうことです。

数値や真偽値でも書ける

リテラル型は文字列だけのものではありません。

type Rating = 1 | 2 | 3 | 4 | 5;
type AlwaysTrue = true;

評価の星の数のように、取りうる値が決まっているものは同じ形で書けます。

手を動かす

演習では、カテゴリを受け取って日本語のラベルを返す関数を書きます。中身の分岐はすでに書いてあるので、カテゴリの型を自分で定義して、引数に付けてください。定義した型に無い文字列を渡そうとすると、その場で止まります。

リテラル型

値そのものを型として書く

union にすると選択肢の一覧になる

エディタが候補を出してくれる

数値や真偽値でも書ける

手を動かす

要件

入出力例

ヒント

メモ