Javascript callback with setTimeout

Question

I am really new to funcitonal paradigm and I have a hard time understanding what is going on with the following snippet.

const countDown = (val, cb, delay = 1000) => {
  cb(val, delay);
  return (val > 0) ? setTimeout(() => countDown(val - 1, cb, delay), delay) : val;
}

countDown(5, console.log, 100)

Why the following doesn't work, given the fact that setTimeout takes a function as an argument?

const countDown = (val, cb, delay = 1000) => {
  cb(val, delay);
  return (val > 0) ? setTimeout(countDown(val - 1, cb, delay), delay) : val;
}

countDown(5, console.log, 100)

You're not passing it a function argument, you're passing it the result of countDown. That's why the arrow function exists on the first example. — Sterling Archer
– Sterling Archer, Commented Aug 10, 2017 at 18:02
countDown is a function, but countDown(val - 1, cb, delay) is not. — Bergi
– Bergi, Commented Aug 10, 2017 at 18:39

Orlandster · Accepted Answer · 2017-08-10 18:06:46Z

1

The setTimeout function takes a callback function as first argument. So in your example you need to pass a function definition and not the function call.

this is a function definition: () => countDown(val - 1, cb, delay), delay)

or the same without arrow functions: function() { countDown(val - 1, cb, delay), delay) }

while this is a function call: countDown(val - 1, cb, delay)

answered Aug 10, 2017 at 18:06

Orlandster

4,9184 gold badges35 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Mulan · Accepted Answer · 2017-08-10 22:05:24Z

This is another way you can look at your problem. countDown is concerned with repeatedly calling a function, decrementing a counter, and inserting some time in between the function calls – that's a lot for one function.

I'll be abstracting some of this complexity away with delay and effect and repeat. You'll notice that countDown requires zero logic once we've abstracted to this point – this is sometimes why people say functional programs can take on a declarative resemblance.

const delay = ms => x =>
  new Promise (r => setTimeout (r, ms, x))

const effect = f => x =>
  (f (x), x)
  
const repeat = n => f => x =>
  n === 0 ? x : repeat (n - 1) (f) (f (x))
  
const countDown = (x, ms, f) =>
  repeat (x)
         (p => p.then (effect (f)) .then (delay (ms)) .then (x => x - 1))
         (Promise.resolve (x))
  
countDown (5, 1000, console.log)
  .then (x => console.log ('done', x))

Collectives™ on Stack Overflow

Javascript callback with setTimeout

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related