The Invocation Context (This) of the Foreach Function Call

The invocation context (this) of the forEach function call

I finished construction of the forEach method and wanted to share this diagram with everyone, hope it helps someone else trying to understand its inner workings.

Using `this` in a forEach()

Pass this as the second parameter to forEach

arr.forEach(callback, thisArg);

Per MDN Documentation:

thisArg:

Optional. Value to use as this when executing callback.

I've updated your fiddle to show it's usage, but the gist is change this call:

this.colors.forEach(function(a) {
    this.colors.forEach(function(b) {
        if(a !== b) {
            combos.push([a, b]);
        }
    });
});

To this:

this.colors.forEach(function(a) {
    this.colors.forEach(function(b) {
        if(a !== b) {
            combos.push([a, b]);
        }
    });
}, this); // <- pass this as second arg

Also of note is that many other Array.prototype methods that accept a callback also support this idiom, including:

• forEach
• map
• every
• some
• filter

However, if you just need to specify what this is bound to when calling a function, and that function is not set as a property on the object, then probably the most idiomatic way would be with Function.prototype.call() or Function.prototype.apply().

And if ES6 is available to you, then an arrow function would be even better, as it inherits this from the calling context:

this.colors.forEach(a => {
    this.colors.forEach(b => {
        if(a !== b) {
            combos.push([a, b]);
        }
    });
});

Why this refers to Window in forEach in javascript?

.forEach() specifies the value of this within the iterator based on its 2nd parameter, thisArg.

arr.forEach(callback[, thisArg])

So, it will only use a particular object if you provide it:

arr.forEach(function(e){
    console.log(this);
}, arr); // <---

Otherwise, the value of this will be the default value of a normal function call -- either undefined in strict mode or the global object (window in browsers) in non-strict.

function foo(e) {
    console.log(this);
}

foo();            // [object Window]

[1].forEach(foo); // (same)

---

Though, the arr is still provided to the iterator, just as its 3rd argument:

arr.forEach(function (e, i, arr) {
    console.log(arr);
});

How to pass context to forEach() anonymous function

Store the current this in some other variable in Chart like this

function Chart() {
    var self = this;
    this.draw = function(data) {
        data.forEach(function(value) {
            //do something with values
            console.log(self);
        });
    }
};

Also, you can pass the this like the following, as Array.prototype.forEach accepts this

arr.forEach(callback[, thisArg])

For example,

this.draw = function(data) {
    data.forEach(function(value) {
        //do something with values
        console.log(this);
    }, this); // Pass the current object as the second parameter
}

call user function in foreach loop

Returning a value in a forEach callback has no effect. It certainly is not the return value of the function that the forEach is part of.

So change this:

this.vertexes.forEach(function (entry) {
    if(id==entry.id){
        //correct element found,displayed and returned
        console.log(entry);
        return entry;
    }
});

to this:

return this.vertexes.find(function (entry) {
    return id==entry.id;
});

How do I bind the parameter 'this' to each element of an array when using forEach()?

The .forEach() facility passes three arguments to your callback function:

1. The current element of the array;
2. The index into the array;
3. The array itself.

Thus:

collectibles.forEach(function(collectible) {
  // the parameter "collectible" will be the
  // current array element
});

There's really no need to bind this, but if you absolutely wanted to you could:

collectibles.forEach(function callback(collectible) {
  if (this !== collectible)
    callback.call(collectible, collectible);
  else {
    // body of function
  }
});

compose foreach loop:@Composable invocations can only happen from the context of a @Composable function

There is items parameter in LazyColumn

LazyColumn {
        items(listy) { message ->
            testCard(message)
        }
    }

Or you can simply change LazyColumn to Column

Access this inside Object.keys in ES6

That's because the function-context (the this) of the function you're passing into forEach() is now window and it's no longer your Test instance.

If you'll use an arrow-function instead, you'll be able to preserve the lexical-scope and your this would point to the current (Test) instance:

Object.keys(this.obj).forEach((name, index) =>
{
    alert(this.obj[name])
});

See MDN

---

Related Topics