CodeBox CodeBox

【Typescript】constructorの引数にオブジェクトを渡す方法【オブジェクト指向】

Typescript / JS

概要

constructorの引数にオブジェクトを渡す方法について解説していきます。

引数にオブジェクトを渡さない場合(改善前)

下記コードでもインスタンスを問題なく作成できるのですが、各引数が何を表しているのか把握しておく必要があります。ですので、
hpの値を間違えて2番目(= attack)に与えてしまうと、予想と違う結果になってしまいます。

class Yusya{
    hp: number
    attack: number
    defence: number

    constructor(hp: number, attack: number, defence: number){
        this.hp = hp
        this.attack = attack
        this.defence = defence
    }
}

const yusya = new Yusya(100, 30, 20)
console.log(yusya)

# 実行結果
Yusya { hp: 100, attack: 30, defence: 20 }


引数にオブジェクトを渡す場合(改善後)

インスタンス化する際の引数をオブジェクトで与えてやれば、引数の順番を考える必要もなくなります。

interface Argument{
    hp: number
    attack: number
    defence: number
}

class Yusya{
    hp: number
    attack: number
    defence: number

    constructor(args: Argument){
        this.hp = args.hp
        this.attack = args.attack
        this.defence = args.defence
    }
}

const yusya = new Yusya({hp:100, attack:30, defence:20})
console.log(yusya)

# 実行結果
Yusya { hp: 100, attack: 30, defence: 20 }