treehouse : what would you like to learn today?
Web Design Web Development iOS Development

Forums

Illustration by Nick Sirotich

Functions and JQuery need help

  • Yurda
    Permalink to comment #
    Hi, guys
    Sorry for my bad english...

    Yesterday i was started learning a JQuery at codeacademy. I have some experience with Javascript and JQeury and i thought that iam not a beginner until i was found this exercise.. I realy cant figure out in past 30 minutes what is the correct answer. Please guys youre much more smarter then me and i need your help. Can somebody explaine me step by step what that function doing :) ?


    //this function adds 3 to the number passed in
    function addThree(x) {
        return x + 3;
    }

    //this function takes a function and returns
    //a function that runs the function it was passed,
    //and then runs that function _again_ on the return
    //value of the first call to the function.
    //make sense? look at it until it does.
    function composed(func) {
        return function(x) {
            return func(func(x))
        }
    }

    composed(addThree)(4);
    //what does that return?
    var answer = ;
  • jamy_za
    Permalink to comment #
    How I understand it is:
    function log(text){
    	 console.log(text);
    }
    log('example'); // logs 'example'
    console.log(log); 
    /*
    logs:
    function log(text){
    	 console.log(text);
    }
    */

    So you're essentially doing this:
    function log(text){
    	 console.log(text);
    }('example')
    But that will fail, why? Because it is functionally the same as doing this:
    function log(text){
    	 console.log(text);
    };('example')

    Notice the semi-colon? Those are seen as 2 completely different statements, so obviously it will fail. How would you get it to work? Like this:
    (function log(text){
    	 console.log(text);
    })('example'); // logs 'example'
    // or
    (function log(text){
    	 console.log(text);
    }('example')); // logs 'example'

    In the above examples the functions are being wrapped in such a way that it is telling javascript that the following statement is still part of the expression. So to recap: 
    (function log(text){
    	 console.log(text);
    })('example'); // logs 'example'

    //is functionally the same as
    function log(text){
    	 console.log(text);
    }
    log('example'); // logs 'example'

    // which is functionally the same as
    (function(text){
    	 console.log(text);
    })('example'); // logs 'example'
    // The above example doesn't have a title, since it's not needed. This is called an Immediately Invoked Function Expression(IIFE)

    Ok now that is all out the way, lets look at your example. function composed(func) is returning a function. So it's functionally the same as calling the function it returns. The only difference is that the variable 'func' is being passed down into the function it returns. This is called a closure (google it). The only use the composed function has is that it passed that func variable into the function it returns, so:
    composed(addThree);
    //is functionally the same as:
    (function(x) {
    	 addThree(addThree(x))
    })(4)


    So all the composed function is doing is returning other functions. It's a bit convoluted for what it's trying to do, but it's trying to explain how closures work.

    Does this make sense? Also, this is pretty advanced js stuff actually. Advanced in the sence that it's playing with the way that the language works on a fundamental level. So if you don't 100% understand it right now, don't worry, you will learn :p
Add a Comment