フリーランス 技術調査ブログ

フリーランス/エンジニア Ruby Python Nodejs Vuejs React Dockerなどの調査技術調査の備忘録

TypeScriptのジェネリックス②

はじめに

interfaceに対してジェネリックスを利用する

interface Database<T> {
  uuid: string
  data: T[]
}

const database: Database<string> = {
  uuid: 'dadfdas34543523425fsadfsafsadfasf',
  data: ['hoge']
}

console.log(database)

const database2: Database<number> = {
  uuid: 'dadfdas34543523425fsadfsafsadfasf',
  data: [12]
}

console.log(database2)

- 実行結果

{ uuid: 'dadfdas34543523425fsadfsafsadfasf', data: [ 'hoge' ] }
{ uuid: 'dadfdas34543523425fsadfsafsadfasf', data: [ 12 ] }

全部オプショナルプロパティ属性になる

interface ChackList {
  title: string
  memo: string
}

type checkList = Partial<ChackList>
// 全部Readonly属性になる
type checkListRead = Readonly<ChackList>

const fetchDate: Promise<string> = new Promise(resolve => {
  setTimeout(() =>{
    resolve('hello')
  }, 3000)
})
fetchDate.then(data =>{
  data.toUpperCase()
})

Conditional Types

type ConditionalType = 'PHP' extends string ? number : boolean
// infer R は型推論する
type ConditionalTypeInfer = {skill: string} extends {skill: infer R } ? R : boolean
type DistributiveConditionalTypes<T> = T extends 'php' ? number : boolean;
let genericsTmp4: DistributiveConditionalTypes<'ruby' | 'php'>