Как синхронизировать функции загрузки FileReader? - PullRequest
0 голосов
/ 20 февраля 2019

Я хочу прочитать некоторые текстовые файлы и отсортировать их.Я написал следующую функцию:

function load_files (event)
{
  var file;
  var reader;
  var lines = [];

  for (file of event.target.files)
  {
    reader = new FileReader();
    reader.onload = function (event)
    {
      let l = this.result.split (/\r?\n/); // lines to add
      for (let i = 0; i < l.length; i++)
        lines.push(l[i]);
    };
    reader.readAsText (file);
  }

  // how to wait for all onload functions here?

  replace_log(lines.sort());
}

Прежде чем я смогу отсортировать строки, мне нужно подождать, чтобы вся загрузка была завершена.Как мне дождаться асинхронных звонков?

Ответы [ 2 ]

0 голосов
/ 25 февраля 2019

Благодаря Кариму и его предложению использовать обещания , я его получил.

function load_files (event)
{
  Promise.all(
    (function* () {
      for (let file of event.target.files) {
        yield new Promise(resolve => {
          let reader = new FileReader();
          reader.onload = (event) => resolve(event.target.result);
          reader.readAsText(file);
        })}})())
    .then(texts => {
      let lines = [].concat.apply([], texts.map(text => text.split (/\r?\n/)));
      replace_log (lines.sort());
    });
}
0 голосов
/ 20 февраля 2019

вы можете даже подсчитать количество повторных вызовов и запустить сортировку при чтении всех файлов

function load_files (event) {
var file;
var reader;
var lines = [];
let count = 0;
for (file of event.target.files) {
    reader = new FileReader();
    // this event is triggered only in case of success
    reader.onload = function (event) {
      let l = this.result.split (/\r?\n/); // lines to add
      for (let i = 0; i < l.length; i++)
        lines.push(l[i]);
    };
    // this event is triggered both in case of success or failure when the op. is completed
    reader.onloadend = function(event) {
      if(++count === event.target.files.length)
        replace_log(lines.sort());
    }
    reader.readAsText (file);
  }
} 

или, альтернативно, вы можете использовать Promises

function read_file(file) {
  return new Promise((resolve, reject) => {
    var fr = new FileReader();
    fr.onload = () => {
      resolve(fr.result);
    };
    fr.readAsText(file);
  });
}

function load_files(event) {
  var file;
  var reader;
  var lines = [];
  let count = 0;
  let promises = []; // collect all promises
  for (file of event.target.files) {
    promises.push(read_file(file));
  }

  Promise.all(promises) // wait for the resolutions
    .then(results => {
      for (result of results) {
        let l = result.split(/\r?\n/); // lines to add
        for (let i = 0; i < l.length; i++)
          lines.push(l[i]);
      }
      replace_log(lines.sort());
    })
}
...