Some User
Some User

Reputation: 5827

JavaScript - ForEach

I have a JavaScript array of objects. Something like this:

var people = [
  { id:1, firstName: 'Joe', lastName: 'Smith' },
  { id:2, firstName: 'Bill', lastName: 'Smith' }
];

I am iterating through the people using forEach. Here is my code:

function doSomething() {
  people.forEach(function(person, self) {
    self.helpPerson(person);
  }, this);
}

function helpPerson(person) {
  alert('Welcome ' + person.firstName);
}

I am trying to call helpPerson from within the forEach loop. However, when I attempt to call it, I get an error that says:

TypeError: self.helpPerson is not a function

If I add console.log(self);, "0" gets printed to the console window. This implies that I'm not passing in my parameter correctly. Or, I'm misunderstanding closures (just when I thought I fully understood it :)).

So, why doesn't self exit?

Upvotes: 3

Views: 1372

Answers (5)

Nina Scholz
Nina Scholz

Reputation: 386604

Please see comments

var people = [
    { id:1, firstName: 'Joe', lastName: 'Smith' },
    { id:2, firstName: 'Bill', lastName: 'Smith' }
];

function doSomething() {
    people.forEach(function(person) { // no parameter for index required
        helpPerson(person);           // just call the function
    });                               // no other parameter is required
}

function helpPerson(person) {
    alert('Welcome ' + person.firstName);
}

doSomething();

Upvotes: 0

Jonathan.Brink
Jonathan.Brink

Reputation: 25393

You don't need to invoke helpPerson with a this, self, or any other context. Just invoke it directly:

var people = [
  { id:1, firstName: 'Joe', lastName: 'Smith' },
  { id:2, firstName: 'Bill', lastName: 'Smith' }
];

function doSomething() {
  people.forEach(function(person) {
    helpPerson(person);
  });
}

function helpPerson(person) {
  alert('Welcome ' + person.firstName);
}

When you log self to the console you are seeing "0" because it is printing the index of the loop iteration.

See the documentation for forEach to see what callbacks are passed to it's forEach function.

Typically, self is used to capture a context in a closure (var self = this;). Please see the related links to this question because that is a very important concept.

Upvotes: 7

Ramanlfc
Ramanlfc

Reputation: 8354

forEach takes 2 parameters : a function(val, index, arr) and a this binding argument .

 people.forEach(function(person, self) {
    self.helpPerson(person); // self here would be array index number
  }, this);

the way you've defined helpPerson() you can call it directly like helpPerson(person);

Upvotes: 0

Brennan
Brennan

Reputation: 5732

forEach passes two arguments to the callback: the item being iterated and its index. That's why console is logging 0.

You are expecting this to pass as an argument, when it's actually more magical than that. You can use this inside the callback and it will use the context of whatever this you passed as an argument to the forEach

function doSomething() {
  people.forEach(function(person, index) {
    this.helpPerson(person); //Or for brevity, you can just remove `this` here
  }, this);
}

function helpPerson(person) {
  alert('Welcome ' + person.firstName);
}

Upvotes: 0

Quentin
Quentin

Reputation: 943561

helpPerson is a global variable, not a property of the array.

self.helpPerson(person); should be helpPerson(person);

Upvotes: 0

Related Questions