その他の方法：Math.min()とMath.max()、テンプレートリテラル、ライブラリの使用

TypeScriptで数値を特定の範囲に制限する方法

型ガードとデフォルト値

function clamp(value: number, min: number, max: number): number {
  if (value < min) {
    return min;
  } else if (value > max) {
    return max;
  } else {
    return value;
  }
}

const num = clamp(10, 0, 5); // num は 5 になる

この例では、clampという関数を作成して、数値を指定された範囲内に制限しています。

• value は制限したい数値
• min は最小値

この関数は、まずvalueがminよりも小さいかどうかをチェックします。小さい場合はminを返します。次に、valueがmaxよりも大きいかどうかをチェックします。大きい場合はmaxを返します。それ以外の場合は、valueをそのまま返します。

型エイリアス

type Age = number & { _tag: 'Age' };

function getAge(age: Age): Age {
  if (age < 0 || age > 120) {
    throw new Error('Invalid age');
  }
  return age;
}

const myAge = getAge(25); // myAge は Age 型になる

この例では、Ageという型エイリアスを作成して、0から120までの数値を表す型を定義しています。

• number は数値型
• _tag: 'Age' はリテラル型

getAgeという関数は、Age型の変数を受け取り、その値が有効かどうかをチェックします。有効でない場合はエラーをスローします。

enum

enum Color {
  Red,
  Green,
  Blue,
}

function setColor(color: Color): Color {
  if (!Object.values(Color).includes(color)) {
    throw new Error('Invalid color');
  }
  return color;
}

const myColor = setColor(Color.Blue); // myColor は Color.Blue になる

この例では、Colorというenumを作成して、赤、緑、青を表す定数を定義しています。

• Red、Green、Blue は定数

• 上記以外にも、ライブラリを使用して数値を制限する方法もあります。
• 型ガードや型エイリアスを使用する場合は、コードの読みやすさを考慮して、適切な名前を付けることが重要です。

型ガードとデフォルト値

function clamp(value: number, min: number, max: number): number {
  if (value < min) {
    return min;
  } else if (value > max) {
    return max;
  } else {
    return value;
  }
}

const num1 = clamp(10, 0, 5); // num1 は 5 になる
const num2 = clamp(-1, 0, 5); // num2 は 0 になる
const num3 = clamp(11, 0, 5); // num3 は 5 になる

console.log(num1, num2, num3); // 5 0 5

型エイリアス

type Age = number & { _tag: 'Age' };

function getAge(age: Age): Age {
  if (age < 0 || age > 120) {
    throw new Error('Invalid age');
  }
  return age;
}

const myAge1 = getAge(25); // myAge1 は Age 型になる
// const myAge2: Age = 150; // エラー: 150 は 0 から 120 までの範囲に含まれていない

console.log(myAge1); // 25

enum

enum Color {
  Red,
  Green,
  Blue,
}

function setColor(color: Color): Color {
  if (!Object.values(Color).includes(color)) {
    throw new Error('Invalid color');
  }
  return color;
}

const myColor1 = setColor(Color.Blue); // myColor1 は Color.Blue になる
// const myColor2: Color = 'Purple'; // エラー: 'Purple' は Color 型ではない

console.log(myColor1); // Color.Blue

実行方法

tsc filename.ts

生成されたJavaScriptファイルをブラウザで開いて実行すると、結果が表示されます。

数値を特定の範囲に制限する他の方法

Math.min()とMath.max()

const num = Math.min(Math.max(value, min), max);

この方法では、Math.min()とMath.max()関数を使用して、数値を指定された範囲内に制限します。

• Math.min() は、複数の数値の中で最小値を返します。

この方法はシンプルですが、型安全性がないという欠点があります。

テンプレートリテラル

type Age = `${number & { _tag: 'Age' }}`;

const myAge: Age = `25`; // myAge は Age 型になる
// const invalidAge: Age = `-1`; // エラー: -1 は 0 から 120 までの範囲に含まれていない

console.log(myAge); // 25

この方法は、テンプレートリテラルを使用して、数値の範囲を制限することができます。

• テンプレートリテラルの中に、数値とリテラル型を組み合わせることができます。
• リテラル型は、型ガードとして機能します。

この方法は、型安全性があり、コードも読みやすくなります。

ライブラリの使用

clampやvalidateなどの機能を提供するライブラリを使用することもできます。

これらのライブラリを使用すると、コードをより簡単に書くことができます。

数値を特定の範囲に制限する方法はいくつかあります。具体的な状況に応じて、適切な方法を選択してください。