Where is my javascript going wrong?

Question

I am fairly new to JS and regular expressions. I was hoping somebody here could help me out with a problem I'm having.

So in my code, what I want to happen is to get an array with each word in the English language in its own index (here's a link to the .txt file I am reading from). So far, I have this:

$(document).ready(function(){
    var allWords;
    function getAllWords(list) {
        $.get("wordlist.txt", function (words) {
            var re = "/\w+$/m"
            list = words.split(re);
            console.log(list);
        });
    }
    getAllWords(allWords);
    console.log(allWords);
});

But instead of having each word in its own index, it returns an array with all of the words in one index. Can anybody tell me where I went wrong/point me in the right direction? I can clarify more if needed.

Thanks in advance!

The `$.get()` in `getAllWords()` is asynchronous which means its internal callback is called sometime later). You can't just assign its result to a global and expect to use it in the next line. The Ajax call will not yet have finished. — jfriend00, Oct 11 '14 at 05:38
There are many other things wrong here too. Passing an empty `allWords` variable and expecting that an assignment to that argument will somehow return that value is just wrong and it looks like you have regex problems too. — jfriend00, Oct 11 '14 at 05:41
See http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-ajax-call for how to handle results from an ajax call. It looks like you don't understand asynchronous operations. — jfriend00, Oct 11 '14 at 05:43

anubhava · Accepted Answer · 2014-10-11T18:50:05.897

2

Couple of problems:

Regex literal doesn't need to be quoted like var re = "/\w+$/m";
Regex itself is wrong, it should be var re = /\s+/; to break a line into words splitting on white spaces.

Update:: Updated code with possible fixes:

re = /\s+/g;
$(document).ready(function() {    
    function getAllWords() {
        $.get("wordlist.txt", function (response) {
            var allWords = response.split(re);
            console.log( allWords );
        });
    }    
});

edited Oct 11 '14 at 18:50

answered Oct 11 '14 at 05:33

anubhava

761,203
64
569
643

Yes `\s` also matches `\n` in addition to a space and tab – anubhava Oct 11 '14 at 05:41
There are multiple other problems in this code (wrong handling of async operations, wrong passing of a variable and expecting it to act like a reference, etc...). The regex is probably the least of the problems. – jfriend00 Oct 11 '14 at 05:43
Yes that is true. I am not jquery dev but still can see many issues in the code. regex problem was the first one to hit my eyes. – anubhava Oct 11 '14 at 05:49
Well like I said, I am still fairly new to JS in general and this is my first "real" project with it. If you could, will you provide examples of how I can better my code? – Vitorossi Oct 11 '14 at 05:58
@Vitorossi: You're most welcome, pls do proper testing as I know well about regex but not a jquery expert. – anubhava Oct 11 '14 at 06:18
I'm still surprised this is the accepted answer because this will not work at all due to the async nature of `$.get()`. – jfriend00 Oct 11 '14 at 17:12
@jfriend00: I added javascript/jquery code as an addendum only with a note in the comments, my main answer as you have noted is on using the correct regex. – anubhava Oct 11 '14 at 18:26
Then, take the jQuery out of your answer and ONLY answer about the regex because your jQuery code simply doesn't work and thus this is a poor reference of an answer (it's an answer with code that won't work). – jfriend00 Oct 11 '14 at 18:40
I only added after your's and OP's comment but it is updated now. – anubhava Oct 11 '14 at 18:51

score 1 · Answer 2 · answered Oct 11 '14 at 06:02

There are multiple problems with your code:

The regex is wrong.
Passing an undefined argument to getAllWords() and somehow expecting the result to end up in that variable.
$.get() is asynchronous so you can't use it's result in the next line of code.

Here's one approach that would work. This fixes the regex and adds a callback argument that gets called when the data is available:

$(document).ready(function(){
    function getAllWords(fn) {
        $.get("wordlist.txt", function(data) {
            var words = data.split(/\s+/);
            fn(words);
        });
    }
    getAllWords(function(words) {
        console.log(words);
    });
});

Or, using jQuery promises (which is my preferred way of handling async operations):

$(document).ready(function(){
    function getAllWords(fn) {
        return $.get("wordlist.txt").then(function(data) {
            return data.split(/\s+/);
        });
    }
    getAllWords.then(function(words) {
        console.log(words);
    });
});

So in your first approach, the variable "words" is the same as my array "allWords"? I just want to see if I am understanding this correctly. — Vitorossi, Oct 11 '14 at 06:07
@Vitorossi - sort of. But I'm using a local variable because global variables are of little use (and bad practice) when using asynchronous operations like `$.get()`. — jfriend00, Oct 11 '14 at 06:17

score 0 · Answer 3 · answered Oct 11 '14 at 05:33

0

Remove the dollar sign from your regex. So do this: var re = /\w+/m;

answered Oct 11 '14 at 05:33

Noitidart

35,443
37
154
323

Where is my javascript going wrong?

3 Answers3