Zenn
AIQ Tech Blog (有志)Publicationへの投稿
🗾

TypeScriptで性別, 年代, 都道府県 の判定 Utilsを作成する

まさぴょん
2023/09/18に公開
JavaScript
TypeScript
techblog
utils
tech

こんにちは、AIQ株式会社のフロントエンドエンジニアのまさぴょんです！

今回は、TypeScriptで性別, 年代, 都道府県 の判定 Utilsを作成する方法について解説します。

TypeScriptで、性別, 年代, 都道府県 の判定 Utilsを作成する

TypeScriptで、性別, 年代, 都道府県 の判定 Utilsを作成することになりました。

要件定義

要件をまとめると、次のとおりです。

  1. DBから取得するDataでは、性別, 年代, 都道府県は、Numberで管理されている。
  2. なので、Front側で、対照Dataを用意して、Numberに紐づく定数Dataで判定する必要がある。

性別, 年代, 都道府県 の対照DataSetを定義する

  • 性別, 年代, 都道府県の対照DataSetを作成しました。
  • それぞれ、Numberに対して、実態となる値が紐づいています。
  • nullableなColumnので、keyにnullがあります。
    • keyがnull以外は、Index Signatureで型定義をまとめます。
const.ts
interface NumberCodeOrNullListType {
  [key: number]: string;
  null: string;
}

/** 性別 */
export const gender: NumberCodeOrNullListType = {
  null: '-',
  1: '男性',
  2: '女性',
};

/** 年代 */
export const generation: NumberCodeOrNullListType = {
  null: '-',
  1: '10代',
  2: '20代',
  3: '30代',
  4: '40代',
  5: '50代～',
};

/** 都道府県_Data */
export const prefecturesNameList: NumberCodeOrNullListType = {
  null: '-',
  1: '北海道',
  2: '青森県',
  3: '岩手県',
  4: '宮城県',
  5: '秋田県',
  6: '山形県',
  7: '福島県',
  8: '茨城県',
  9: '栃木県',
  10: '群馬県',
  11: '埼玉県',
  12: '千葉県',
  13: '東京都',
  14: '神奈川県',
  15: '新潟県',
  16: '富山県',
  17: '石川県',
  18: '福井県',
  19: '山梨県',
  20: '長野県',
  21: '岐阜県',
  22: '静岡県',
  23: '愛知県',
  24: '三重県',
  25: '滋賀県',
  26: '京都府',
  27: '大阪府',
  28: '兵庫県',
  29: '奈良県',
  30: '和歌山県',
  31: '鳥取県',
  32: '島根県',
  33: '岡山県',
  34: '広島県',
  35: '山口県',
  36: '徳島県',
  37: '香川県',
  38: '愛媛県',
  39: '高知県',
  40: '福岡県',
  41: '佐賀県',
  42: '長崎県',
  43: '熊本県',
  44: '大分県',
  45: '宮崎県',
  46: '鹿児島県',
  47: '沖縄県',
};

性別, 年代, 都道府県 の判定をする utilsを作成する

  • 用意した性別, 年代, 都道府県の「数値と実態となる値の対照表」DataSetをimportします。
  • null以外は、対照DataSetから取り出して、値をreturnすればOKです。
utils.ts
import {
  gender,
  generation,
  prefecturesNameList,
} from '@/config/const';

/** 性別を返す */
export function GenderJudgment(genderNum: number | null) {
  if (genderNum === null) return '-';
  else return gender[genderNum];
}

/** 年代を返す */
export function GenerationJudgment(generationNum: number | null) {
  if (generationNum === null) return '-';
  else return generation[generationNum];
}

/** 都道府県Codeから、都道府県名を返す */
export function PrefectureJudgment(prefectureCode: number | null) {
  if (prefectureCode === null) return '-';
  else return prefecturesNameList[prefectureCode];
}

まとめ

性別, 年代, 都道府県 の判定 Utilsは、よくあるパターンだと思うので、活用してみてください。

個人で、Blogもやっています、よかったら見てみてください。

https://masanyon.com/

注意事項

この記事は、AIQ 株式会社の社員による個人の見解であり、所属する組織の公式見解ではありません。

求む、冒険者！

AIQ株式会社では、一緒に働いてくれるエンジニアを絶賛、募集しております🐱🐹✨

エンジニア視点での我が社のおすすめポイント

  1. フルリモート・フルフレックスの働きやすい環境！
    • 前の会社でアサインしてた現場は、フル出社だったので、ありがたすぎる。。。
    • もうフル出社には、戻れなくなります！
  2. 経験豊富なエンジニアの先輩方
    • 私は、3年目の駆け出しエンジニアなので、これが、かなりありがたいです！
  3. 自社開発とR&D(受託開発)を両方している会社なので、経験できる技術が多い。
    • 自社のProduct開発と、他社からの受託案件で、いろいろな技術を学ぶことができます。
  4. AI関連の最新の技術に触れられるチャンスが多い。
    • 自社で特許を持つほど、AI技術に強い会社で、プロファイリングを得意とした技術体系があります。
    • ChatGPTを自社アプリに搭載など、AIトレンドも、もちろん追っており、最新の技術に触れられるチャンスが多いです。
  5. たまに、札幌ラボ(東京から札幌) or 東京オフィス(札幌から東京)に出張で行ける！
    • 東京と、札幌に2拠点ある会社なので、会合などで集まる際に、出張で行けます。

採用技術 (一部抜粋)

  • FrontEnd: TypeScript, JavaScript, React.js, Vue.js, Next.js, Nuxt.js など
  • BackEnd: Node.js, Express,Python など
  • その他技術: Docker, AWS, Git, GitHub など

エントリー方法

  1. 私達と東京か札幌で一緒に働ける仲間を募集しています。
    詳しくは、Wantedly (https://www.wantedly.com/companies/aiqlab)を見てみてください。

Webエンジニア向け説明

https://www.wantedly.com/projects/1089410

データサイエンティスト向け説明

https://www.wantedly.com/projects/1089406

人事に直通(?)・ご紹介Plan(リファラル採用)

私経由で、ご紹介もできますので、興味のある方や気軽にどんな会社なのか知りたい方は、X(旧:Twitter)にて、DMを送ってくれても大丈夫です。
https://twitter.com/masanyon1212

AIQ Tech Blog (有志)
AIQ Tech Blog (有志)Publication

AIQ 株式会社 に所属するエンジニアが技術情報をお届けします。 ※ AIQ 株式会社 社員による個人の見解であり、所属する組織の公式見解ではありません。 Wantedly: wantedly.com/companies/aiqlab

Discussion