

javascriptからTypeScriptへの移行を行っています。

javascriptでは下記のようにobjectのkeyを用いて部分変更ができましたが  
Typescriptでは型が怒られるため実現できていません。  
Typescriptではどう逆立ちしても無理でしょうか？  
巨大なobjectの一部を更新するロジックがかなり多いため、なんとか実現したいのですが。。。

**javascript**

[code]

    let profile = {
        name: 'てすと太郎',
        age: 30,
        tel: '090-0000-0000'
    }
    
    updateProfile(pram) => {
        Object.keys(pram).forEach((key) => {
            profile[key] = pram[key]
        })
    }
    
    updateName() => {
        // nameだけ書き換えたい
        updateProfile({ name: 'てすと花子' })
    }
    
[/code]

**TypeScript**

[code]

    interface Profile {
        name: string
        age: number
        tel: string
    }
    
    let profile: Profile = {
        name: 'てすと太郎',
        age: 30,
        tel: '090-0000-0000'
    }
    
    updateName() => {
        // nameだけ書き換えたい
        updateProfile({ name: 'てすと花子' })
    }
    
    
    updateProfile(pram: object) => {
        // keyの型で怒られる
        Object.keys(pram).forEach((key) => {
            profile[key] = pram[key]
        })
    
        // keyof使って見てもダメ
        Object.keys(pram).forEach((key) => {
            const v:keyof Profile = key
            const name = profile[v]
        })
    }
    
[/code]


CC BY-SA 4.0
2020-06-03T15:44:04.747
67263
2023-01-11T03:05:15.530
2020-06-03T16:59:42.750
3060
16768
question
javascript typescript
interfaceをObject.keysで回して値を更新したい


もしObjectの構造が1次元であるならば、`Partial`とSpread Operatorを使うと次のように書くことができます。

[code]

    interface Profile {
        name: string
        age: number
        tel: string
    }
    
    let profile: Profile = {
        name: 'てすと太郎',
        age: 30,
        tel: '090-0000-0000',
    }
    
    const updateProfile = (params: Partial<Profile>) => {
        profile = { ...profile, ...params };
    }
    
    const updateName = () => {
        updateProfile({ name: 'てすと花子'})
    }
    
    updateName();
    console.log(profile)
    
[/code]

## 参考

  * <https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Spread_syntax>
  * <https://www.typescriptlang.org/docs/handbook/utility-types.html#partialt>


CC BY-SA 4.0
2020-06-04T02:38:17.463
67272
2020-06-04T02:38:17.463
7997
67263
answer


学習中の身ですが

[code]

    interface Profile {
        [key: string]: string | number
        name: string
        age: number
        tel: string
    }
    const updateProfile = (params: Partial<Profile>) => {
        profile[key] = pram[key]!;
    }
    
[/code]

とするのはどうでしょう。


CC BY-SA 4.0
2020-06-04T16:44:45.100
67293
2020-06-04T16:44:45.100
35180
67263
answer