Passing arguments to Array.forEach callback function

Question

someOperation.then(function(x) {
    things.forEach(function(thing) {
        //doing something with 'thing' that depends on variable 'x'
    });
});

In the code above, how can I make the variable 'x' available inside the callback function? Or do I have to go back to using a for loop in this case?

@Gonzalo.- ok I changed my code a bit. Will I still have access to x as a closure? because when I put a breakpoint inside the forEach callback function, I don't see 'x' in the list of closures. — AyushISM
– AyushISM, Commented Apr 22, 2016 at 21:39
to be listed on that list, you have to actual be using it as a closure. If not, all the variables of the universe of your js will be accesible. Just use it inside your function (i.e. print it with console.log) and you'll see it listed — Gonzalo.-
– Gonzalo.-, Commented Apr 22, 2016 at 21:42

j_ernst · Accepted Answer · 2016-04-22 21:35:46Z

2

You can pass a "thisArg" as the second parameter to forEach so for instance:

let x = { a: 123 };
things = ['foo', 'bar']
things.forEach(function(thing) {
    alert( this.a + thing );
}, x);

Might be helpful depending on what you are trying to do.

answered Apr 22, 2016 at 21:35

j_ernst

1,1298 silver badges4 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Mike Cluck · Accepted Answer · 2016-04-22 21:38:41Z

1

It is available.

let x = {
  name: 'Mike'
};
['Hello', 'Goodbye'].forEach(function(greeting) {
  document.querySelector('pre').innerHTML += greeting + ', ' + x.name + '\n';
});

<pre></pre>

What you're using here is known as a closure and is a commonly used feature of Javascript. Basically, any function has access to any other variable in it's parent scope.

function log(msg) {
  document.querySelector('pre').innerHTML += msg + '\n';
}

var global = 'global';
function firstLevel(third) {
  var first = 'first';
  
  // `global` is in the parent scope so we can access it
  log(global + ' -> ' + first);
  
  function secondLevel() {
    var second = 'second';
    
    // Same thing with `first` here
    log(global + ' -> ' + first + ' -> ' + second);
    
    // This even works with passed in arguments
    log(global + ' -> ' + first + ' -> ' + second + ' -> ' + third);
    
    // We can even change closed over variables
    first = 'fourth?';
  }
  
  secondLevel();
  log(first); // Notice that `first` changed.
}

log(global);
firstLevel('third'); // Notice how `third` is used in `secondLevel`

<pre></pre>

edited Apr 22, 2016 at 21:38

answered Apr 22, 2016 at 21:32

Mike Cluck

32.6k13 gold badges84 silver badges95 bronze badges

2 Comments

AyushISM Over a year ago

ok I changed my code a bit. Will I still have access to x as a closure?

Mike Cluck Over a year ago

@AyushISM Yes, you still do. I added an example which uses an argument. It works just the same. You can prove this to yourself by doing console.log(x) in your own code.

Collectives™ on Stack Overflow

Passing arguments to Array.forEach callback function

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related