「プログラミングtypescript」学習メモ1

オライリーの「プログラミングtypescript」の5.13 練習問題 4.b
練習問題がむずくて全然進まん・・

型安全なビルダーパターンの設計について。以下のようなメソッドよびだしを行う。setURL, setMethodは必須、setDataは任意で、最後にbuildメソッドを呼ぶ。

new RequestBuilder2()
            .setData({})
            .setURL('bar')
            .setMethod('post')
            .build()

該当のソースコード

interface BuildableRequest {
    data?: object
    method: 'get' | 'post'
    url: string
}

class RequestBuilder2 {
    data?: object
    method?: 'get' | 'post'
    url?: string

    setData(data: object): this & Pick<BuildableRequest, 'data'>{
        return Object.assign(this, {data})
    }

    setMethod(method: 'get' | 'post'): this & Pick<BuildableRequest, 'method'>{
        return Object.assign(this, {method})
    }

    setURL(url: string): this & Pick<BuildableRequest, 'url'>{
        let h = Object.assign(this, {url})
        console.log(h)
        // RequestBuilder2 { data: {}, url: 'bar' }のような出力になる
        // let h: this & { url: string; } 型
        return h
    }

    build(this: BuildableRequest){
        return this
    }
}

let b = new RequestBuilder2()
            .setData({})
            .setURL('bar')
            .setMethod('post')
            .build()
console.log(b)

学び

• Pick
  https://www.typescriptlang.org/docs/handbook/utility-types.html#picktk
  BuildableRequestからプロパティ'url'などを選んで型を構築する。
• Object.assign
  https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Object/assign
  

よくわからない

なんで{url}と書いたら、{ url: 'bar' } になるんや、誰か詳しい人教えてンゴ・・