Use of "this" as a function?

Question

I inherited some code with a line that I don't understand.

function updateQty () {
        obj.find('.inputAmount').html(qty);
        input.val(qty);

        $.each(change_actions, function() {
            this(qty);
        });
    }

What exactly is happening inside the .each function? I've never seen this(var) used this way before.

Answer 1

this inside of the $.each refers to the current objects that you are looping through.

The object must be a function in order to pass something to it.

Answer 2

the author setup their own events with bindings, so chances are change_actions are functions that are subscribed to run when something happens to the quantity.

Try something like this:

// initialize with a value
var actions = [
    function(x){ console.log('I see a new x: ' + x); }
];

// add actions "later"
actions.push(function(x){ console.log('Yup, a new x: ' + x); });

// Then execute them:
$.each(actions, function(){
  this(4);
});

// add another one still
actions.push(function(x){ console.log(x + ' looks new'); });

// re-iterate over them
// Then execute them:
$.each(actions, function(){
  this(5);
});

and the result:

// first iteration (only 2 subscribed events)
[15:56:50.030] "I see a new x: 4"
[15:56:50.030] "Yup, a new x: 4"

// second iteration (now we have 3, one was added later)
[15:56:50.030] "I see a new x: 5"
[15:56:50.030] "Yup, a new x: 5"
[15:56:50.030] "5 looks new"  // <-- new subscription

think of it like the click event and how you can add subscriptions by binding to $('element').click(). every time a click happens, any subscribed events get triggered.

Answer 3

You can relate to the following example:

var change_actions = [
    function(x) { alert(x + 1); },
    function(x) { alert(x + 2); }
];

var qty = 5;
$.each(change_actions, function() {
   this(qty); 
});

JSFiddle: http://jsfiddle.net/fuyz2/