テンプレートリテラル型で引数が「/」で始まっているかチェックする

概要

以下のようにpathを受け取ってURLを生成する関数を作成したところ、「テンプレートリテラル型を利用することでpathに指定する値に`/fuga`を入れるか`fuga`を入れるか迷わなくなる」というレビューを受けました。

const generateUrl = (path: string) => {
  return `https://hoge/${path}`
}

テンプレートリテラル型を使う

以下のように修正しました！これでgenerateUrl関数を使用するとき`fuga`が引数に渡されたときは、型エラーが出るので迷うことがなくなります(エラーも防げる！)

pathの1文字目が「/」であるかないか判定して「/」を付与する、みたいな処理を入れてもいいがテンプレートリテラル型で簡単にエラーを防げそうなので、これで十分な気がしました！

const generateUrl = (path: `/${string}`) => {
  return `https://hoge${path}`
}

おまけ

以下のようにするともっと型安全になりそう👀(過剰な気もするが...)

const DOMAIN = 'https://hoge' as const
type GenerateUrl = (path: `/${string}`) => `${typeof DOMAIN}${typeof path}`

const generateUrl: GenerateUrl = (path) => {
  return `${DOMAIN}${path}`
}

参考文献

• https://zenn.dev/ak/articles/3e1a9b012b3c84