4

I am trying to convert a .txt deocument into an array.

The document has names in it and is structured like this:

Name1
Name2
Name3

The program has to read the lines and the output should be

["Name1","Name2","Name3"].

I have looked all over the internet, but most solutions just involve node.js, which i cannot install on the computer I need the software on, or some complex xmlhttp code I do not understand. I am just looking for a simple solution.

Can anybody help?

3
  • It's not clear what you're asking. You'll need some mechanism to read the file. What it is depends on your server setup and your preferences. Commented Aug 23, 2021 at 18:36
  • 1
    You can't use node, so where are you running the javascript? A browser? Commented Aug 23, 2021 at 18:36
  • 1
    Or is this just something you'll run locally? Please see How to Ask and provide more information. Commented Aug 23, 2021 at 18:38

3 Answers 3

3

To fetch the file contents you can use the fetch API in js which is pretty simple ( just pass the file url inside as parameter ) and clean to use .. Moreover to solve your issue regarding converting the text extracted from the file into an array you can use string.split method !

async function getFile(fileURL){
    let fileContent = await fetch(fileURL);
    fileContent = await  fileContent.text();
    return fileContent;
}

// Passing file url 
getFile('file.txt').then(content =>{
   // Using split method and passing "\n" as parameter for splitting
   let array =  content.trim().split("\n");
   console.log(array);
}).catch(error =>{
    console.log(error);
});

After getting text you can use string.split method and when used with .trim() method will remove extra spaces too !

Read MDN docs for information about fetch API

Sign up to request clarification or add additional context in comments.

1 Comment

@PhDaher I think here fetch API is what you require here !
3

You could create an <input type="file"> for opening a file from your computer, read it with a FileReader and split() the result by newline (with for example regex /\r?\n/) to become an array of words.

const openFile = (e) => {
  const reader = new FileReader(); // filereader
  reader.readAsText(e.target.files[0]); // read as text
  reader.onload = () => {
    const text = reader.result;
    const result = text.split(/\r?\n/); // split on every new line
    console.log(result); // do something with array
  };
};
<input type='file' accept='text/plain' onchange='openFile(event)'>

You can try it out in this fiddle.

You could also accomplish this in another (newer) way as suggested in the comments, using .then.

const openFile = (e) => {
  e.target.files[0].text().then((t) => {
    const outcome = t.split(/\r?\n/);
    console.log(outcome);
  });
};
<input type='file' accept='text/plain' onchange='openFile(event)'>

3 Comments

A newer approach could be to do: e.target.files[0].text().then(...) and skip the hole FileReader, then you may use async/await if you want to
@Endless I didn't know about this, thank you for suggesting, I added it in.
fyi, you also got file.arrayBuffer() and file.stream() need json? new Response(file).json()
2

Since you won't use node, I am assuming you're running your code on a browser. And the file from an <input type="file"/>

<html>
  <input type="file" id="inputFile">

  <script>
   const inputFile = document.querySelector('#inputFile');

   inputFile.addEventListener('change', () => {
     const fileReader = new FileReader();
     fileReader.onload = e => {
       const array = e.target.result.split('\n');
       console.log(array);
     };
     fileReader.readAsText(inputFile.files[0], 'UTF-8');
   });
  </script>
</html>

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.