CATEGORY

TypeScript Tips

実務で学んだTypeScriptの使い方まとめ。

Extract<T, U>で特定の方を抽出する

ユニオン型TからUで指定した型だけを抽出した型を返すユーティリティ型

https://typescriptbook.jp/reference/type-reuse/utility-types/extract

// 野球場のユニオン型
type BaseballGroundType = "EhimeStadium" | "FukuokaStadium" | "TokushimaStadium" | "HyogoStadium";

// 四国の野球場のユニオン型
type ShikokuStadiumType = Extract<BaseballGroundType, "EhimeStadium" | "TokushimaStadium">

「as const」を使って配列からユニオン型を生成する

// 選手情報の配列
const players = [
	{ name: "John", position: "P" },
	{ name: "Peter", position: "1B" },
	{ name: "Beck", position: "2B" },
] as const

// 選手名のユニオン型を生成
type PlayerNameType = typeof players[number]["name"]

// 選手のポジションのユニオン型を生成
type PlayerPositionType = typeof players[number]["position"]
【GAS×Chatwork】メッセージ一覧をスプレッドシートに出力する 前の記事 Python遊び 次の記事

関連記事

  • Next.js

【Next.js14】Middlewareを使用して未認証ユーザーをログイン画面にリダイレクトさせる方法

Next.jsのMiddlewareは、リクエストが完了する前にコードを実行する機能である。今回は、リクエストが完了する前にユーザーの認証状態をチェックし、未認証の場合はログイン画面にリダイレクトさせる処理を実装した。私はAWS Amplifyを使用してアプリケーションを開発しているが、a
  • JavaScript

【JavaScript】ブラウザ埋め込み型のACEエディタを導入

WEBサイトやCMSの構築に関わっていると、クライアントから管理画面に編集用のエディタを埋め込んで欲しいという依頼をいただくことがあります。非エンジニアの立場からすると、いくらシンプルなHTMLでも触りたくないのは当然です。またWEBサイトを公開した際に、ファイルはサーバー上にあるので更新
  • JavaScript

【JavaScript】画像URLからバイナリデータを取得してサーバーに送信する方法

このブログでは、画像アップロード機能をいくつか紹介していますが、今回は画像URLからデータを取得して、サーバーサイドに送信する方法について解説します。オブジェクト変換などの新しい知識を得ることができたので、忘備録として残します。■ 関連記事 : JavaScriptの基礎習得に役立つ技術書【

コメント

この記事へのコメントはありません。