title: async.each/forEachOf entering next iteration without calling callback
body: <p>I'm trying to use <code>async</code> to iterate over a directory of images within an async <code>waterfall</code> array of functions. </p>
  
  <pre><code>async.waterfall([
  function(callback){
    async.forEachOf(waterfallObj.sizeDirs, function(sizeDir, index, cb){
        //get image files
        fs.readdir(path.join(__dirname, sizeDir), function(err, files){
          tempFiles = files;
          console.log(index); //0 1 2 3 4
          //cb();
        });
    });
  
    callback(null);
  }, /*more functions*/
  ]);
  </code></pre>
  
  <p>The idea is that I don't want to do the next iteration in the <code>forEachOf</code> loop until the <code>readdir</code> finishes reading files. To my understanding, <code>forEachOf</code> will not enter the next cycle of its loop until its callback is called (just like each function in async <code>waterfall</code> or <code>series</code>. However even with <code>cb()</code> commented out like I have above, I still see the index printed 5 times. Why does it not stop with the first iteration? How can I ensure the the readdir will finish before the next iteration if <code>cb</code> does not do this? What is <code>cb</code> supposed to do exactly if not this? (I've also had this same effect using <code>async.each</code>. Should I be using native <code>forEach</code> perhaps?</p>