How to save text file contents to Javascript variable?

问题

I'm trying to read a text file of over 150,000 lines of text. I want to be able to read the text file and pass it as a parameter for processFileContent.

I tried it this way, but it doesn't work. Also, is there a better way to do this for such big data?

function readFile(file) {
  var reader = new FileReader();
  reader.onload = function (evt) {
    var data = evt.target.result;
};
  reader.readAsText(file);
  return data;
}

document.getElementById('file').addEventListener('change', readFile, false);

var data = readFile();

function processFileContent(data) {
  var list = data.split('\n');
  ...

回答1:

FileReader.onload event returns results asynchronously. You can use a callback or Promise to return result of FileReader to processFileContent. Also file at readFile would be event object, not .files property of event.target.

function readFile(event) {
  var file = event.target.files[0];
  if (file) {
    new Promise(function(resolve, reject) {
      var reader = new FileReader();
      reader.onload = function (evt) {
        resolve(evt.target.result);
      };
      reader.readAsText(file);
      reader.onerror = reject;
    })
    .then(processFileContent)
    .catch(function(err) {
      console.log(err)
    });
  }
}

document.getElementById('file')
.addEventListener('change', readFile, false);

function processFileContent(data) {
  var list = data.split('\n');
  ...

回答2:

One of your problems is with scoping. You declared data as a local variable in the onload event handler, and tried returning it from the outer function, in which it was undefined. To fix this, you need to move the variable declaration out of the event handler.

You also are expecting a file as an argument to your event handler it seems, however events pass Event objects to their event handlers. To get the file, you need to get event.target.files[0]. This should fix it.

function readFile(event) {
    var file = event.target.files[0];  // getting the file Blob
    var reader = new FileReader();
    var data;  // moved declaration
    reader.onload = function (evt) {
        data = evt.target.result;
    };
    reader.readAsText(file);
    return data;
}

来源：https://stackoverflow.com/questions/39553614/how-to-save-text-file-contents-to-javascript-variable

标签

javascript

filereader