What is a javascript function saving another function

I see so many functions like this:

form.prototype.smokerDisabled = function(){
  return function(age) {
    return age>=15 ? 'disabled="disabled"' : '';
  };
};

      

why use the current code inside another function and save it. Instead it would have written:

form.prototype.smokerDisabled = function(age){
  return age>=15 ? 'disabled="disabled"' : '';
};

      

Please tell me the difference and using the first approach. Thank.

+3


source to share


7 replies


In this particular case, you have no advantage in the first version of wrt the second.

But there are many situations in which this can be useful. You can use a closure to store data.

Modify your example a bit. Let's create a custom threshold

function createAgeFilter(minAge) {
    return function (age) {
        return age > minAge;
    }
}

      

So you can do

var filter = createAgeFilter(15);
...
if (filter(user.age)) { ... }

      

Instead, you should do



function filter(age, minAge) {
    return age > minAge;
}

      

and therefore

if (filter(user.age,15)) { ... }

      

This helps if you want to avoid repeating 15 every time you have to filter or you want to change the filter implementation without having to update every call to the filter function.

You can find other examples here.

http://www.bernaschina.com/en/blog/software/nodejs-code-reuse-right-way/

+4


source


In this case, I don't think there is any reason why you would do this. The reason you usually see a return function like this is to call closure

that captures the state of an external variable.



+5


source


It all depends on your needs, the first is used when calling f.smokerDisabled () (15) and the second is used when f.smokerDisabled (15) is called. It can be used when closing.

The first:

form.prototype.smokerDisabled = function(){
  return function(age) {
    return age>=15 ? 'disabled="disabled"' : '';
  };
};

var f = new form();
f.smokerDisabled()(15); // returns : disabled="disabled"

      

Second:

form.prototype.smokerDisabled = function(age){
  return age>=15 ? 'disabled="disabled"' : '';
};

var f = new form();
f.smokerDisabled(15); // returns : disabled="disabled"

      

+2


source


When the function returns, it is called a closure. This would be helpful if you are using private variables. So, in your example, let's say your code was like this:

form.prototype.smokerDisabled = function(){
  var smoker = this.needsSmoke;
  return function(age) {
    return age>=15 && smoker ? 'disabled="disabled"' : '';
  };
};

      

This means that the variable smoker

will not be available to other variables. In this case, it may be difficult to see the logic behind it, but imagine you have a number guessing game.

function guesser(){
  var number = Math.floor(Math.random()*10) + 1;
  return function(guess){
      return guess === number ? "You got it!, it was " + number : "Failed - guess again";
  }
}

      

So now you can do:

var round1 = guesser();
round1(3); // "Failed - guess again"
round1(5); // "You got it!, it was 5"

var round2 = guesser();
round2(5); // "Failed - guess again"

      

Each new call guesser()

creates a new random number between 1-10, where you cannot access from the outside (i.e. you can cheat!).

+1


source


There is nothing in your code that it could achieve, but with this:

form.prototype.smokerDisabled = function(minAge){
    return function(age) {
        return age >= minAge ? 'disabled="disabled"' : '';
    };
};

      

You can use a parameter of the first function to create another function.

The creation of a function within a function is at the core of functional programming .

And using a function parameter to create another function, currying is called .

+1


source


Your question:

why use the current code inside another function and keep it?

As in the comments and answers, you assumed that your specific example does not require this.

But if you have an inner function in the scope of the outer function, you must return it to get the result.

What I meant was, let's say this function, which won't work if you remove the return

inner function:

form.prototype.smokerDisabled = function(){
  function(age) { // removed the return here
    return age>=15 ? 'disabled="disabled"' : '';
  };
};

      

so if you call a method smokerDisabled

it returns nothing because it has an inner function that returns the result not an outer function.

So, if you have declaimed an inner function in an outer function, then you need to return an inner function that returns the result of some operation.

+1


source


After googling:

It's called a closure.

Basically, a function defined inside another function is only available inside that function. But it can be transmitted as a result, and then this result can be called.

This is a very powerful feature. You can see more explanation here:

http://web.archive.org/web/20120101221030/http://blog.morrisjohns.com/javascript_closures_for_dummies.html

Hope this helps explain this.

-2


source







All Articles