Turn for loop to async

Question

I have something like this in frontend Javascript:

function myfunc() {
  for (var i=0; i<=1000000000; i++)
    // Do something
  return data;
}

I want to call myfunc() in an async way so that I can pass a callback instead of waiting for the loop to finish.

Is there a way to do this? I can use with or without AngularJS / jQuery

UPDATE 1:

What in "Do something" part is just basic math computation. It doesn't take much time to do one iteration but because the number of loop, this is blocking the browser.

There is no ajax request and I plan not to do this on Node.js server side.

UPDATE 2:

I just want to be more specific on the "Do something" part. It is canvas processing. See

https://github.com/girliemac/Filterous/blob/master/src/filterous.js#L73

for (var i = 0; i < d.length; i += 4) {
    var r = d[i];
    var g = d[i + 1];
    var b = d[i + 2];
    // CIE 1931 luminance
    var avg = 0.2126*r + 0.7152*g + 0.0722*b;
    // d is a reference to pixels.data, so you do not need to reassign it
    d[i] = d[i + 1] = d[i + 2] = avg
}

Maybe there is a way to make this async manner so it doesn't freeze the browser or iOS Safari for like 2 seconds. It's very noticeable on mobile.

http://old.erickrdch.com/2012/05/asynchronous-loop-with-jquery-deferred.html — Ehsan Sajjad, Jun 29 '14 at 08:10
Use a [WebWorker](http://www.html5rocks.com/en/tutorials/workers/basics/). — , Jun 29 '14 at 08:10
http://stackoverflow.com/questions/15504921/asynchronous-loop-of-jquery-deferreds-promises — Ehsan Sajjad, Jun 29 '14 at 08:10
You don't need web workers or promises (although promises could help you differentiate between success and error, and chain executions if needed). Just accept a function as the first parameter to the `myFunc` function, and call it whenever you're done processing whatever you're doing. Note that using a callback system here won't change the fact that the `for` loop (if that's you're real code) will block anything asynchronous anyways. If this **is** your code, you'll have to use Web Workers to overcome the synchronous nature of the loop — Ian, Jun 29 '14 at 08:14
What's happening in `//Do something`? If there's a (or in this case 1000000000) HTTP request(s) hiding in there then all OP needs is a callback when everything is done. If there's nothing async happening there then yes, web workers. — ivarni, Jun 29 '14 at 08:24

score 1 · Answer 1 · answered Jun 29 '14 at 08:14

1

a callback is very trivial thing

function myfunc(callback) {
  for (var i=0; i<=1000000000; i++)
    // Do something

  callback(data);
}

so you can call it like

myfunc(function(data){


});

answered Jun 29 '14 at 08:14

john Smith

17,409
11
76
117

1

While I agree, the `for` loop will block the expected asynchronous behavior of the callback, making it useless. Depending on what their code really is, they may need Web Workers – Ian Jun 29 '14 at 08:18

score -2 · Answer 2 · answered Jun 29 '14 at 08:17

-2

call it like this

function myfunc() {
  for (var i=0; i<=1000000000; i++)
    // Do something
  return data;
}

$timeout(myfunc, 0);

inject $timeout in your controller/service

answered Jun 29 '14 at 08:17

can someone please provide an explanation for downvote?? – Jun 29 '14 at 09:04

Turn for loop to async

2 Answers2