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

type User = {
  id: number
  name: string
  username: string
  email: string
  address: {
    street: string
    suite: string
    city: string
    zipcode: string
    geo: {
      lat: string
      lng: string
    }
  }
  phone: string
  website: string
  company: {
    name: string
    catchPhrase: string
    bs: string
  }
}

const getUserData = async (): Promise<unknown> => {
  try {
    const response = await fetch('https://jsonplaceholder.typicode.com/users/1')
    const userData = await response.json()
    return userData
  } catch (error) {
    console.error(error)
    throw error
  }
}

const fetchUserData = async () => {
  try {
    const userData = await getUserData()
    // 問題1. 絞り込んだ値に型アサーションを行いましょう
    // この下に解答してください
    if (typeof userData === 'object') {
      const { name } = userData as User
      console.log(name)
    }
  } catch (error) {
    console.log(error)
  }
}

fetchUserData()


type User = {
  id: number
  name: string
  username: string
  email: string
  address: {
    street: string
    suite: string
    city: string
    zipcode: string
    geo: {
      lat: string
      lng: string
    }
  }
  phone: string
  website: string
  company: {
    name: string
    catchPhrase: string
    bs: string
  }
}

const getUserData = async (): Promise<unknown> => {
  try {
    const response = await fetch('https://jsonplaceholder.typicode.com/users/1')
    const userData = await response.json()
    return userData
  } catch (error) {
    console.error(error)
    throw error
  }
}

const fetchUserData = async () => {
  try {
    const userData = await getUserData()
    // 問題1. 絞り込んだ値に型アサーションを行いましょう
    // この下に解答してください
  } catch (error) {
    console.log(error)
  }
}

fetchUserData()


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

instanceof(TypeScript)

型ガード（in、instanceof）

リテラル型

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

?(optional chaining)

?(optional property)

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

unknown型

typeof(TypeScript)

unknown

Union型

ユニオンの絞り込み

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

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

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

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

TypeScriptコース

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

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

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

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