20251125mon
1. TS/JSのsliceは配列を切り取る。
以下の場合、配列は一つで三つ分のオブジェクトを返す。
return sortedResponses.slice(0, limit).map((response) => ({
id: response.id,
name: response.name,
date: formatZonedDate(response.submittedAt, userTz, "yyyy-MM-dd HH:mm", "")
}))
2. 並び替え
b-a は降順。
const sortedResponses = [...responses].sort((a, b) => {
const dateA = new Date(a.submittedAt).getTime()
const dateB = new Date(b.submittedAt).getTime()
return dateB - dateA
})
3. スプレッド構文
✅ スプレッド構文は「シャローコピー(浅いコピー)」
新しい配列(新インスタンス)を作るが、中身のオブジェクトは複製しない
users = [ ObjA, ObjB ]
[...users] → 新しい配列インスタンス
[ ObjA, ObjB ](中身は同じ参照)
しかし、配列内のオブジェクトは複製されない(参照が同じ)
const users = [{ name: "A" }];
const copy = [...users];
copy[0].name = "B";
console.log(users[0].name); // "B"(同じオブジェクト参照)
4. ユニオン型
’desc’か’asc’のいずれか。デフォルトは’desc’
order: 'desc' | 'asc' ='desc'
T のプロパティ名のユニオン (たとえば、 “id” | “name” | “submittedAt”のいずれかがキーになる。)
dateKey: keyof T
5. ジェネリクス構文のきまり
// 関数宣言の場合
// 引数や戻り値で使う型パラメータを、関数名直後に宣言する必要がある」
function 関数名<T, U>(引数: T): U { }
// アロー関数の場合
const 関数名 = <T>(引数: T): T => { }
// クラスの場合
class クラス名<T> { }
6. ジェネリクス(何回もやって覚える)
const sortByDate = <T>(
array: T[],
dateKey: keyof T,
order: 'desc' | 'asc' = 'desc'
): T[] => {
return [...array].sort((a, b) => {
const dateA = new Date(a[dateKey] as string | number | Date).getTime()
const dateB = new Date(b[dateKey] as string | number | Date).getTime()
return order === 'desc' ? dateB - dateA : dateA - dateB
})
}
#TypeScript #JavaScript #ジェネリクス