Ok my questions comes from an example from a book that i'm trying to understand.Keep in mind i just got into javascript.

So we have the object set and we define the function foreach. It takes another function as a parameter and invokes it for every item of an array "values" that belongs to set.

set.foreach = function(f,c) {
    for(var i = 0; i < this.values.length; i++) 
        f.call(c,this.values[i]);
};

So far so good..

But i can't understand the usage of the foreach function in the second snipet.In particular i don't understand the role of the variable v. It is not defined enywhere else in the book and i m having a really hard time to understand how this work.We define another function in set to take the values as an array

set.toArray = function() {
    var a = [];
    this.foreach(function(v) { a.push(v); }); //where did v came from???
    return a;
}

Ok my questions comes from an example from a book that i'm trying to understand.Keep in mind i just got into javascript.

So we have the object set and we define the function foreach. It takes another function as a parameter and invokes it for every item of an array "values" that belongs to set.

set.foreach = function(f,c) {
    for(var i = 0; i < this.values.length; i++) 
        f.call(c,this.values[i]);
};

So far so good..

But i can't understand the usage of the foreach function in the second snipet.In particular i don't understand the role of the variable v. It is not defined enywhere else in the book and i m having a really hard time to understand how this work.We define another function in set to take the values as an array

set.toArray = function() {
    var a = [];
    this.foreach(function(v) { a.push(v); }); //where did v came from???
    return a;
}

• javascript

• I'm more surprised you didn't ask about the lack of the function names. Parameters are pretty basic, but if you're getting this far, you're doing well in learning JS. – vol7ron Commented Jun 22, 2011 at 4:27

6 Answers 6

set.foreach = function(f,c) {
    for(var i = 0; i < this.values.length; i++) 
        f.call(c,this.values[i]);
}; //                 ^-------------- being passed right here

The function you passed in is f, and f is invoked having the this value of its calling context set to c, and this.values[i] passed as the first argument.

       // ------v---------your function "f" in the forEach
this.foreach(function(v) { a.push(v); });
       // ------------^------references the first argument (after the "this" arg)
       //                      that was passed to "f"

Here's a simpler example:

This function accepts a function as a parameter. The only thing it does is call the function:

function my_func( fn ) {
    fn();
}

   // call my_func, which will call the function you give it
my_func( function() { alert( "hi" ); } );

Live Example: http://jsfiddle.net/6a54b/1/

...so passing the function to my_func will alert the string "hi". No surprise.

But what if my_func provided the value to be alerted?

function my_func( fn ) {
    fn( "message from my_func" );  // call the fn passed, giving it an argument
}  //            ^------------------------------------------------|
   //                                                             |
   //               v------references the arg passed by my_func---|
my_func( function( arg ) { alert( arg ); } );

Live Example: http://jsfiddle.net/6a54b/

Now you can see that an argument is being passed to the function we're sending over, and we reference that argument with the arg parameter.

It alerts whatever my_func gave it.

We can even take it one step further, by passing a second argument to my_func that my_func will simply take and pass it to the function we pass in.

function my_func( fn, str ) {
    fn( str );  // call the fn passed, giving it
}                                  //    the string we passed in

   //               v------the arg we passed here-----v
my_func( function( arg ) { alert( arg ); }, "I'm getting dizzy!" );

Live Example: http://jsfiddle.net/6a54b/2/

And you can see that both arguments are given to my_func, and my_func calls the function we passed in, passing it the string argument we gave it.

The variable vis an argument being passed to the function. It allows you to work with whatever the function receives. It is no different than namein the following example:

function sayHello(name) {
  console.log('Hello '+name);
}

f.call mean calling function f with arguments this.values[i]. this in foreach is set. about calling foreach from toArray, passing function with v, the values[i] in foreach become v in toArray.

v in this case is being passed in from the call statement f.call(c, this.values[i]). Specifically, it is this.values[i]

The above statement is equivalent to simply:

f(this.values[i])

where f is the function in your 2nd snippet (function(v){ a.push(v); });)

The reason it's typed as .call instead of just calling it is so that the this property can be set, so this in your 2nd function is the array itself, meaning you could type:

function(v){
   alert(this.length); // "this" == array
}

v represents each item in the list as your foreach() function loops through them.

so if you have 10 items in your "set" the function will be called 10 times, providing each item in the set to the function as argument v

for example:

set = [1,2,3,4,5];

set.foreach = function(fn, context) {
  for(var i = 0; i < this.values.length; i++) {
    fn.call(context, this.values[i]);
  }
};

set_times_2 = [];
set.foreach(function(item) {
  set_times_2.push(item);
  set_times_2.push(item);
});

// this is true now:
set_times_2 == [1,1,2,2,3,3,4,4,5,5];

Lots of answers, here's one that specific to your question.

> this.foreach(function(v) { a.push(v); }); //where did v came from???

In the function expression passed to foreach, v is a formal parameter. Including an identifier as a formal parameter is more or less equivalent to declaring it in the function body with var. Maybe it's clearer if written as:

this.foreach( function (v) {
    a.push(v);
});

or not...