34
Drakota
5y

I was in a technical interview for a web development position. When it was time for them to choose a question they showed me this:

How can you make this code display 0 to 9 correctly?
for (var i=0; i < 10; i++){
setTimeout(function(){
console.log(i);
}, 1000);
}

When I saw the question I instantly smiled and rubbed my hands ready to answer since I knew exactly the answer and they told me:
"Oh you looked already familiar to this one, we'll choose another for you"

I legit stood up and left the fucking interview right there.

Comments
  • 6
    Not a js person here.

    Doesn't the code do that already?
  • 16
    @netikras No, the timeout waits in a seperate thread so the for loop will just loop through, thus setting i to 10. After the 1 second wait, it will display 10, ten times.
    You can fix this by using let instead of var.
  • 2
    @netikras nope . Easiest way would be use let instead of var
  • 0
    @Marl3x or an iife wrapper
  • 3
    I would first ask is this common thing in their code and if it is run away.
  • 1
    @Marl3x gotcha!

    Js has threads now? I recall it used to rely on alarm() and was strictly single-threaded
  • 3
    @netikras Yeah using thread isn't the right word. It has an event-loop and puts actions there to be executed at a later time. It runs through this loop does what it has to do and continues in search for the next action.
    There is a great Video about it: https://youtu.be/cCOL7MC4Pl0

    But yeah, you're right. It is single threaded.
  • 0
    @Marl3x I think actual implementation inside browser engine is execute loop to add function into timer linked list and after timeout execute those functions in same thread.

    The only other thread I know is requestanimationframe and web workers.
  • 11
    By removing setTimeout.
  • 1
    @netikras it's really misleading but you really only have one thread to execute your code with. However what you do have are functions (like fetch and setTimeout) that the engine you're running JS on can run.

    So in the browser when call setTimeout you basically tell the engine (spidermonkey, v8, etc.) "hey can you tell me to run this function after n milliseconds?" and that will happen. That function you need to call will then (thanks to the event loop) be called when the call stack is empty
  • 0
    @inaba so yeah, I guess that means the alarm() mechanism is still running JS then :)
    I got confused when he said "Threads" and "Javascript".

    https://perldoc.perl.org/functions/...
  • 6
    @hack This is the actual real-world answer, there's no reason to have a bunch of setTimeout calls here especially since they all have the same delay. Providing a code sample that would fail code review and expecting people to replace it with another version that would also fail code review sounds like a failing grade for the interviewing company.
  • 5
    I would indignantly ask them "really? This is the kind of code you write?"

    @HollowKitty is right. This is a hard fail. This is also why I loathe whiteboarding: it's full of gimmicks and gotchas like this, it shows the interviewers basically nothing useful, and it's both stressful and needlessly difficult for the interviewee.
  • 1
    This is closure . I was asked the same question.
Add Comment