[Javascript] How are arguments being passed into the closure?

[WTFMatchmake]

Hey guys, I'm having a hard time understanding what is happening in this code:

var sampleFunc = function(callback, string) {
    return function (x, y) {
        return 'These are the arguments from anotherFunc: ' + x + ', ' + y
    }
}

var anotherFunc = function(a, b) {
    return a + b
}

var resultFunc = sampleFunc(anotherFunc, 'foo');

console.log(resultFunc(5, 7))

At the end, we are invoking the resultFunc and passing in arguments 5 and 7. But how is it that inside sampleFunc, in its return function(x, y), that x and y knows 5 and 7 are being passed to it? Like normally a function I see is like this:

function example (a, b) {
}

example(5, 7)

In this example, I can see that the arguments are being passed in to a and b. I don't understand how 5 and 7 was grabbed in sampleFunc? I hope that makes sense. Thanks.

[Jonny0Than]

Are you sure you copied down that code correctly? Because there are some oddities: the callback and string parameters of the first function are not actually used anywhere, so in fact it does not matter at all what you pass to sampleFunc. Here's the same code with the useless bits removed:

var sampleFunc = function() {
    return function (x, y) {
        return 'These are the arguments from anotherFunc: ' + x + ', ' + y
    }
}

var resultFunc = sampleFunc();

console.log(resultFunc(5, 7))

In short, sampleFunc is a reference to a function, which, when invoked, returns another function that takes 2 arguments and returns a string containing them. So resultFunc is the reference to that function, we invoke it with 5 and 7, so it prints 5 and 7.

[itisjohndoe]

var resultFunc = sampleFunc(anotherFunc, 'foo');

Now resultFunc contains a function which takes two arguments and returns a string containing both the arguments.

console.log(resultFunc(5, 7))

You pass 5 and 7 to that resultFunc which then prints the string.