Using JavaScript/JQuery to get words from a text file

  • Context: Java 
  • Thread starter Thread starter Jamin2112
  • Start date Start date
  • Tags Tags
    File Text
Click For Summary

Discussion Overview

The discussion revolves around methods for reading lines from a text file into a JavaScript array using jQuery and XMLHttpRequest. Participants explore the challenges of variable scope and asynchronous behavior in JavaScript when dealing with file reading.

Discussion Character

  • Technical explanation
  • Exploratory
  • Homework-related

Main Points Raised

  • One participant shares a jQuery method using $.get to read a text file and expresses a need to access the resulting array outside the callback function.
  • Another participant provides a link to a Stack Overflow post that discusses using 'push' to manipulate arrays, suggesting it may help with the issue.
  • A participant suggests declaring the variable "var words" before the $.get call but notes that the asynchronous nature of the call may lead to timing issues when trying to access the data later in the code.
  • Another participant proposes using XMLHttpRequest as an alternative to jQuery, providing a code snippet that demonstrates a synchronous approach to reading the file, which they claim works.

Areas of Agreement / Disagreement

Participants express differing views on the best approach to handle asynchronous data retrieval in JavaScript. There is no consensus on a single solution, as some prefer jQuery while others suggest using XMLHttpRequest.

Contextual Notes

Participants highlight the importance of understanding asynchronous behavior in JavaScript, particularly how it affects variable availability and scope. The discussion does not resolve the best method to use, leaving multiple approaches open for consideration.

Jamin2112
Messages
973
Reaction score
12
I was searching around the internet for a procedure to read lines of a text file into a JavaScript array. Most of the procedures I saw used Ajax, which I don't understand yet, so I'll refrain from trying to cut-and-paste code that I don't understand.

I found this

Code: 
        $.get('wordsEn.txt', function(myContentFile)
        {
            words = myContentFile.split("\r\n");
        }, 'text');

JQuery function call, which does the trick, but how can I get words into the scope outside of the function call? I want to actually be able to use it.
 
Technology news on Phys.org
You can declare "var words" before the .get call - but I think that's only half the problem.
I haven't used jQuery, but I suspect that "myContentFile" becomes available asynchronously to the rest of the program. So let's say you put the "var words;" and "$.get(..." in the <head> section and a reference to the words array "later" in the body. What will happen is that the reference in the body will happen before the data is ready - that is, before the "function(myContentFile)" is called.

Unless you're already using the jQuery library, I would used code such as this:
Code: 
<html>
<head>
<script type="text/javascript">
var Words;
var WordFile = new XMLHttpRequest();
  WordFile.open("GET", "file:///C:/temp/html/words.txt", false);
  WordFile.onreadystatechange =
    function () {
      if(WordFile.readyState === 4)
      {
        if(WordFile.status === 200 || WordFile.status == 0)
        {
          Words = WordFile.responseText.split("\r\n");
        }
      }
    };
  WordFile.send(null);
</script>
</head>
<body>
<script type="text/javascript">
document.write(Words[2]);
</script>
</body>
</html>
 
  • Like
Likes   Reactions: 1 person
.Scott said:
You can declare "var words" before the .get call - but I think that's only half the problem.
I haven't used jQuery, but I suspect that "myContentFile" becomes available asynchronously to the rest of the program. So let's say you put the "var words;" and "$.get(..." in the <head> section and a reference to the words array "later" in the body. What will happen is that the reference in the body will happen before the data is ready - that is, before the "function(myContentFile)" is called.

Unless you're already using the jQuery library, I would used code such as this:
Code: 
<html>
<head>
<script type="text/javascript">
var Words;
var WordFile = new XMLHttpRequest();
  WordFile.open("GET", "file:///C:/temp/html/words.txt", false);
  WordFile.onreadystatechange =
    function () {
      if(WordFile.readyState === 4)
      {
        if(WordFile.status === 200 || WordFile.status == 0)
        {
          Words = WordFile.responseText.split("\r\n");
        }
      }
    };
  WordFile.send(null);
</script>
</head>
<body>
<script type="text/javascript">
document.write(Words[2]);
</script>
</body>
</html>

Seems to work. Thanks.
 

Similar threads

HTML/CSS Is it possible to use js variables in html while using Puppeteer?
  • · Replies 5 ·
Replies
5
Views
3K
Java Javascript reading files: how should I have asked?
  • · Replies 4 ·
Replies
4
Views
1K
Java How to associate several component events to one JavaScript file?
  • · Replies 5 ·
Replies
5
Views
2K
Java How can I read a local file into an array in JavaScript?
  • · Replies 6 ·
Replies
6
Views
4K
Java How does this Promise program flow work in javascript?
  • · Replies 1 ·
Replies
1
Views
2K
Storing program source as relations in a database instead of text file
  • · Replies 65 ·
3
Replies
65
Views
5K
Java FileFinder using Breadth First Search algorithm fails
  • · Replies 2 ·
Replies
2
Views
2K
Java Promises hell/chaining promises in Javascript
  • · Replies 9 ·
Replies
9
Views
2K
JavaScript Localstorage not getting cleared by window.localStorage.clear()
  • · Replies 12 ·
Replies
12
Views
4K
Java Why use spread operator when sorting an array in JavaScript?
  • · Replies 2 ·
Replies
2
Views
2K