なぜ私の財産はデコレータのObject.definePropertyの後に消滅しますか？

Question

私は文字列番号をjavascript番号にキャストするデコレータを持っています。例えば、"87"→87。

コードは非常に簡単です：

function digit(target: any, key: string) { 

    // property value 
    var _val = this[key]; 

    // property getter 
    var getter =() => _val; 

    // property setter 
    var setter = (newVal) => _val = parseInt(newVal) 

    // Create new property with getter and setter 
    Object.defineProperty(target, key, { 
    get: getter, 
    set: setter, 
    enumerable: true, 
    configurable: true, 
    }); 
} 

class User { 

    @digit 
    public id: number; 
    public isActive: boolean; 

    constructor(instanceData) { 
    this.id = instanceData.id; 
    this.isActive = instanceData.isActive; 
    } 
} 

let user = new User({ 
    id: '712', 
    isActive: '1' 
}) 

console.log([user.id]) // [ 712 ] as expected 
console.log(user) // Person { isActive: '1' } 

は、idフィールドは、第二にconsole.logに表示されないのはなぜ、どのように私はそれを表示させることができますか？ 私はそれにアクセスできますが、コンソールには表示されません。

ありがとうございます！インスタンスプロパティのproperty decoratorため

Answer 1

はない任意インスタンスに、クラスのプロトタイプに適用されます。 new User()に電話する前にUserのインスタンスが存在しないため、これが可能な最善の方法です。 console.log()を使用してデバッグ出力を取得すると、インスタンスのownプロパティのみが表示され、プロトタイプのプロパティは表示されません。

すべてのインスタンスは、プロトタイプを共有しているので、あなたはおそらく、このようにそれを行うにはしたくない：

let user = new User({ 
    id: '712', 
    isActive: '1' 
}) 
let user2 = new User({ 
    id: '567', 
    isActive: '1' 
}) 
console.log(user.id) // 567! 

つのプロトタイプ、クラス全体に対して1つのid値。すべてUserオブジェクトは同じidを持ちます。おっとっと。

---

あなたはおそらく、彼らが利用可能な場合、少なくともインスタンスに何かをしたい：

function digit(target: any, key: string) { 
    // Create new property with getter and setter 
    Object.defineProperty(target, key, { 
    get: function() { return this._val }, 
    set: function (newVal) { this._val = parseInt(newVal) }, 
    enumerable: true, 
    configurable: true, 
    }); 
} 

お知らせgetとset方法内部thisの使用。つまり、インスタンスに_valプロパティが追加されます。したがって、別のプロパティを取得します。 console.log()からidが表示されず、はと表示されます（_valを参照）。

---

私はここに列挙するために、それはあなたがconsole.log()と期待するものを出力します（インスタンスごとに1つid）期待するように動作するようにオブジェクトを設定するには、あまりにも多くの方法があります。ヒント：デコレータを使用するのではなく、クラスコンストラクタを変更して、プロパティアクセサーをインスタンスに配置することができます。そして、追加された_valが列挙できないようにして、表示されないようにしてください。希望は助けます。がんばろう！