forEach コールバック関数の 'this' 値 (または呼び出しコンテキスト) とは何なのか疑問に思っていました。このコードは機能していないようです:
var jow = [5, 10, 45, 67];
jow.forEach(function(v, i, a){
this[i] = v + 1;
});
alert(jow);
説明してくれてthx。
forEach コールバック関数の 'this' 値 (または呼び出しコンテキスト) とは何なのか疑問に思っていました。このコードは機能していないようです:
var jow = [5, 10, 45, 67];
jow.forEach(function(v, i, a){
this[i] = v + 1;
});
alert(jow);
説明してくれてthx。
MDN の状態:
array.forEach(callback[, thisArg])
thisArg パラメーターが forEach に提供されている場合、callback.call(thisArg, element, index, array) が呼び出されたかのように、各コールバック呼び出しの this 値として使用されます。thisArg が未定義または null の場合、関数内の this 値は、関数が厳密モードかどうかによって異なります (厳密モードの場合は渡された値、非厳密モードの場合はグローバル オブジェクト)。
つまり、コールバックのみを提供し、非厳密モード (提示したケース) の場合、それはグローバル オブジェクト (ウィンドウ) になります。
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach
forEach メソッドの作成が完了したので、この図をみんなと共有したいと思いました。他の誰かがその内部の仕組みを理解しようとするのに役立つことを願っています。
forEach 内でthis
は、グローバルwindow
オブジェクトを参照します。これは、別のオブジェクト (つまり、作成したオブジェクト) から呼び出した場合でも当てはまります。
window.foo = 'window';
var MyObj = function(){
this.foo = 'object';
};
MyObj.prototype.itirate = function () {
var _this = this;
[''].forEach(function(val, index, arr){
console.log('this: ' + this.foo); // logs 'window'
console.log('_this: ' + _this.foo); // logs 'object'
});
};
var newObj = new MyObj();
newObj.itirate();
// this: window
// _this: object
に 2 番目のパラメータを渡さない場合forEach
、this
はグローバル オブジェクトを指します。やろうとしていたことを達成するために
var jow = [5, 10, 45, 67];
jow.forEach(function(v, i, a) {
a[i] = v + 1;
});
console.log(jow);
出力
[ 6, 11, 46, 68 ]
「これ」コンテキストの質問に対する非常に単純なアプローチがあり、次のようになります。「これ」のコンテキストが何であるかを知りたいときはいつでも、それより左側に発信者がいない場合、誰が発信者に残されているかを確認してください。はグローバルであり、それ以外の場合はそのオブジェクト インスタンスです:
例:
let obj = { name:"test", fun:printName }
function printName(){
console.log(this.name)
}
//who is left to the caller? obj! so obj will be 'this'
obj.fun() //test
//who is left to the caller? global! so global will be 'this'
printName() //undefined (global has no name property)
したがって、コールバック関数を指定する「foreach」の場合、foreach の実装で実際に起こることは次のようになります。
--> [1,2,3].foreach(callback,'optional This') を呼び出します
foreach(arr,cb)
{
for(i=0; i<arr.len;i++)
{
//who is left to the caller? global! so it will be 'this'
cb(arr[i])
}
}
オプションの 'this' を指定するか、コールバックを this (たとえばアロー関数) にバインドしない限り、呼び出されたコールバックが既に 'this' obj を持っている場合は、指定されたコンテキストの変更を「ブロック」します。バインドの詳細については、ここにリンクの説明を入力してください。 ただし、基本的にバインドの実装は次のようになります。
Function.prototype.bind = function (scope) {
var fn = this;
return function () {
return fn.apply(scope);
};
}
したがって、fn (コールバック) が常に「this」(スコープ) で呼び出されることがわかります。
それが役に立てば幸い...