UtilityTypeを組み合わせる

Partial<T>

Required<T>

Pick<T, K>

Omit<T, K>

interface Color {
  red: number
  green: number
  blue: number
}

type ColorWithoutBlue = Omit<Color, 'blue'>

const myColor: ColorWithoutBlue = {
  red: 100,
  green: 100
}

// 問題1. オプショナルを取り除いたname、ageプロパティの型を取得してください
type User = {
  id: number
  name?: string
  age?: number
}

// この下に解答してください
type RequiredNameAge = Required<Pick<User, 'name' | 'age'>>
const user1: RequiredNameAge = {
  name: 'Taro',
  age: 20
}

// 問題2. オプショナルにしたname、ageプロパティの型を取得してください
type User2 = {
  id: number
  name: string
  age: number
}

// この下に解答してください
type PartialNameAge = Partial<Pick<User2, 'name' | 'age'>>
const user2: PartialNameAge = {
  name: 'Taro',
  age: 20
}

const user3: PartialNameAge = {
  name: 'Taro'
}

const user4: PartialNameAge = {
  age: 20
}


// 問題1. オプショナルを取り除いたname、ageプロパティの型を取得してください
type User = {
  id: number
  name?: string
  age?: number
}

// この下に解答してください
type RequiredNameAge = User
const user1: RequiredNameAge = {
  name: 'Taro',
  age: 20
}

// 問題2. オプショナルにしたname、ageプロパティの型を取得してください
type User2 = {
  id: number
  name: string
  age: number
}

// この下に解答してください
type PartialNameAge = User2
const user2: PartialNameAge = {
  name: 'Taro',
  age: 20
}

const user3: PartialNameAge = {
  name: 'Taro'
}

const user4: PartialNameAge = {
  age: 20
}


【演習】特定の型を取得しよう

ジェネリクス

Partial

Required

Pick

Omit

Exclude<T, U>

Exclude

Extract<T, U>

Extract

Readonly<T>

Readonly

NonNullable<T>

NonNullable

Parameters

ReturnType

【演習】特定の型を取得しよう2

TypeScriptコース

【基礎中の基礎👼🏻】基本から抑えるTypeScript

「使えると便利！TypeScriptのUtilityType入門」レッスンの総復習クイズです。

使えると便利！TypeScriptのUtilityType入門の総復習クイズ

使えると便利！TypeScriptのUtilityType入門