web-dev-qa-db-ja.com

「これ」はforeachループ内では未定義です

いくつかのTypeScriptコードを書いて、配列を繰り返しています。ループ内で、「this」オブジェクトにアクセスして、次のような処理を実行しようとしています。

console.log('before iterate, this = ' +this);
myarray.days.forEach(function(obj, index) {
    console.log('before transform, this : ' + this);
    this.datePipe.transform...
});

「this」は未定義であると文句を言うので、これは失敗します。「this」オブジェクトはループの前/外で[object object]として正しく印刷されますが、ループ内では未定義です。何故ですか？そして、それに対する修正は何ですか？

typescripttypescript2.0typescript1.8
24
user1892775

矢印関数 を使用する必要があります：

myarray.days.forEach((obj, index) => {
    console.log('before transform, this : ' + this);
    this.datePipe.transform...
});

または bind method を使用します。

myarray.days.forEach(function(obj, index) {
    console.log('before transform, this : ' + this);
    this.datePipe.transform...
}.bind(this));

その理由は、通常の関数をコールバックとして渡すとき、呼び出されたときにthisが実際に保存されないためです。
上で述べた2つの方法は、関数の将来の実行のために正しいthisスコープが保持されることを保証します。

55
Nitzan Tomer

thisをコールバックのパラメーターとして追加します。

}.bind(this));の代わりに}, this);を追加すると、Angularの問題が解決されるはずです。

したがって、次のようになります。

myarray.days.forEach(function(obj, index) {
    console.log('before transform, this : ' + this);
    this.datePipe.transform...
}, this);
7
rc.adhikari

これを試して：

myarray.days.forEach( (obj) => {
    console.log('before transform, this : ' + this);
    this.datePipe.transform...
});
1
Eray T