Union型

// 問題1. ユニオンを絞り込もう（1）
const getType = (input: number | string) => {
  // この下に解答してください
  if (typeof input === 'string') {
    return '文字列型です'
  } else {
    return '数値型です'
  }
}

console.log(getType('Taro'))
console.log(getType(100))

// 問題2. ユニオンを絞り込もう（2）
interface Circle {
  kind: 'circle'
  radius: number
}

interface Square {
  kind: 'square'
  width: number
  height: number
}

const calculateArea = (shape: Circle | Square): number => {
  // この下に解答してください
  if (shape.kind === 'circle') {
    return Math.PI * shape.radius * shape.radius
  } else {
    return shape.width * shape.height
  }
}

const circle: Circle = { kind: 'circle', radius: 10 }
console.log(calculateArea(circle))

const square: Square = { kind: 'square', width: 4, height: 6 }
console.log(calculateArea(square))


// 問題1. ユニオンを絞り込もう（1）
const getType = (input: number | string) => {
  // この下に解答してください
  return '文字列型です'
}

console.log(getType('Taro'))
console.log(getType(100))

// 問題2. ユニオンを絞り込もう（2）
interface Circle {
  kind: 'circle'
  radius: number
}

interface Square {
  kind: 'square'
  width: number
  height: number
}

const calculateArea = (shape: Circle | Square): number => {
  // この下に解答してください
  return Math.PI * shape.radius * shape.radius
}

const circle: Circle = { kind: 'circle', radius: 10 }
console.log(calculateArea(circle))

const square: Square = { kind: 'square', width: 4, height: 6 }
console.log(calculateArea(square))


ユニオンの絞り込み

instanceof(TypeScript)

型ガード（in、instanceof）

リテラル型

型ガード（リテラル型、ユーザー定義の型）

?(optional chaining)

?(optional property)

オプショナルでnull安全なコーディングをしよう

unknown型

typeof(TypeScript)

unknown

APIレスポンスの型ガード(undefined)

APIレスポンスの型ガード(in)

型アサーション(asもしくは<>)

APIレスポンスのエラーハンドリング型ガード(unknown)

APIレスポンスのエラーハンドリング型ガード(typeof)

APIレスポンスのエラーハンドリング型ガード(instanceof)

TypeScriptコース

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

「ゴリ押ししないTypeScript 〜型ガードの使いどころ5選〜」レッスンの総復習クイズです。

ゴリ押ししないTypeScript 〜型ガードの使いどころ5選〜の総復習クイズ

ゴリ押ししないTypeScript 〜型ガードの使いどころ5選〜