Передача параметра в событие загрузки файла FileReader

19

Мне нужно прочитать некоторые файлы csv, заданные пользователем. Файлы передаются на страницу / скрипт с помощью div и drop div, который обрабатывает падение файла следующим образом:

function handleFileDrop(evt) {
    evt.stopPropagation();
    evt.preventDefault();
    var files = evt.dataTransfer.files; // FileList object.
    ...
}

Мне нужно проанализировать каждый файл с помощью библиотеки csv, которая преобразует ее в массив, но мне также нужно отслеживать имя файла, который я сейчас разбираю. Вот код, который я использую для анализа каждого файла:

for(var x = 0; x < files.length; x++){
    var currFile = files[x];
    var fileName = currFile.name;
    var reader = new FileReader();
    reader.onload = (function(theFile){
        return function(e){
            var csvArr = CSV.csvToArray( e.target.result, ";", true );
            console.log(csvArr); 
        };
    })(currFile);   
    reader.readAsText(currFile);
}

До этого все отлично работает. Мне нужно также передать имя файла в событие reader.onload , например:

reader.onload = (function(theFile){
    return function(e){

       ***** I need to have fileName value HERE *****

    };
})(currFile); 

Возможно? Как я могу это сделать? Заранее благодарим за любую помощь, с наилучшими пожеланиями.

    
задан BeNdErR 05.06.2013 в 12:13
источник

1 ответ

43

Попробуйте следующее:

var reader = new FileReader();
reader.onload = (function(theFile){
    var fileName = theFile.name;
    return function(e){
        console.log(fileName);
        console.log(e.target.result);
    };
})(currFile);   
reader.readAsText(currFile);

Здесь вы создаете новую переменную fileName каждый раз, когда файл передается внешнему методу. Затем вы создаете функцию, которая имеет доступ к этой переменной (из-за закрытия) и возвращает ее.

    
ответ дан Graham 05.06.2013 в 12:23
источник
  • Гений! Большое спасибо, я тянул свои волосы, пытаясь это сделать. Кажется, я начинаю понимать закрытие сейчас! –  Fiver 28.04.2014 в 14:52
  • Как можно получить как имя файла, так и значение reader.result? –  PatriceG 05.12.2014 в 14:01
  • У меня возникли проблемы с кодом, откуда идет 'theFile'? Я могу видеть, где определяется currFile, но к чему относится «theFile»? –  NiallJG 07.05.2016 в 00:21
  • @NiallJG Если вы посмотрите на то, что назначено свойству onload, мы фактически выполняем функцию и передаем в currFile. Внутри этой функции theFile - это просто другое имя для файла, который мы передали. Это позволяет нам хранить ссылку на имя этого файла, к которой можно получить доступ, когда содержимое файла действительно будет прочитано. –  Graham 09.05.2016 в 11:10
  • @John Внутренняя функция - это замыкание, так как она сохраняет ссылку на переменную fileName после ее возврата. Синтаксис, который вы просматриваете, часто называют коротко выраженным выражением Function или Invalid Function. –  Graham 30.05.2016 в 09:11
Показать остальные комментарии