Interview Questions

  • View all interview questions
  • blank
  • 3 common JavaScript closure questions
    A lecturer at Hack Reactor made this comment on Quora in response to a question about preparing for the Hack Reactor admission's challenge:
    One big thing that will help you: get intimately familiar with the concepts of recursion and JavaScript closures ... they will come up early in your interactions with Hack Reactor (and are just great things to understand in general).
    Below we'll cover some common questions dealing with closures. In another post we'll cover some recursion questions with solutions.

    Sources

    https://www.quora.com/How-did-you-prepare-for-Hack-Reactors-admissions-challenge

    Questions

    1What will the following code output?
    for (var i = 0; i < 3; i++) {
      setTimeout(function() { alert(i); }, 1000 + i);
    }
    Answer

    You need to be a member to see the answers.

    2Write a function that would allow you to do this.
    var addSix = createBase(6);
    addSix(10); // returns 16
    addSix(21); // returns 27
    
    Answer

    You need to be a member to see the answers.

    3How would you use a closure to create a private counter?
    Answer

    You need to be a member to see the answers.

    Become a Premium Member

    With our large collection of challengs, tutorials, and solutions, we make it easy for you to become a better coder, prepare for interviews, and learn new skills from more experienced coders.

    “I got my App Academy acceptance yesterday, and Coderbyte was definitely a huge help.” ― Tomer
    • 200+ Coding Challenges
    • Mock Interview Questions
    • 500,000+ Code Solutions
    • Algorithm Tutorials
    • Interview Prep Courses
    mrdaniel published this on 12/6/15 | javascript, bootcamp, closure, Hack Reactor, MakerSquare
    Comments
  • +
  • 9
  • -
  • Hello mrdaniel!! I am still confused about the first example. The output of the original code is 3s after 1 1.1 1.2 seconds. The confusion is the reference to i. The alert uses i which gives out 3 but the delay (1000+i) uses the immediate i? why is the delay using the instanteous i from the loop but the alert uses the last i in the loop? Did the IIFE use a closure that stored a local value so the i from loop cannot interfere? any help would be greatly appreciated.
  • +
  • 7
  • -
  • For question 1, why doesn't the second argument for setTimeout 1000 + i yield 1.001 sec? if 1000 msec = 1 sec, then 1100 is 1.1 sec, right?
  • +
  • 7
  • -
  • Why do you need the inner - inner function to be the IIFE? What is wrong with making the anonymous function in setTimeout as an Immediately Invoked Function Expression, like so (sorry if my formatting is off) :
    for (var i = 0; i < 3; i++) {
      setTimeout(function(j) { 
      	return alert(j); 
        }(i), 1000 + i);
    }
    
    Seems to work fine without the extra function. What am I missing?
  • +
  • 6
  • -
  • Hello txafter, setTimeout is a higher order function (i.e. a function that takes one or more functions as parameters - these function(s) passed as parameters are also known as callbacks). setTimeout has two arguments: the first argument is the function to be invoked (in this case the anonymous function with the alert call), and the second argument is a time interval in milliseconds. setTimeout's job, when called, is to immediately set a timer that will expire after a specified time interval (the second argument to setTimeout). When that timer expires, the code that is in the callback function of the first argument passed to setTimeout is executed (and when this callback function is executed, that's where the interesting effects of JS closures come in...but correct me if I'm wrong, it seems like you have a good handle on that part). setTimeout does not wait for the time interval to expire and then execute. setTimeout executes immediately. It is the callback function in setTimeout's first argument that waits/executes. Let me know if this explanation makes sense.
  • +
  • 3
  • -
  • Hi! I wrote the following code for question 3. My code looks almost identical to the anwer given above. But when I ran it, only the last input value into the counter is registered. I'm not sure what went wrong. Any insights?
    var counter=function() {
      var _counter=0;
      return {
        add: function(num) { _counter=+num; },
        retrieve: function() { return "the value of counter is currently: "+_counter; }
      };	
    };
    
    var count=counter();
    count.add(9);
    count.add(5);
    count.retrieve(); //==> 'the value of counter is currently: 5'
    
  • +
  • 1
  • -
  • @natashache, in your add function you need to write:
    _counter += num
    not =+ That should fix it :)
    Login to submit a comment