Question

I am using an approach described in detail at Dictionary Lookups in Javascript (see the section”A Client-Side Solution”) to create an object that contains a property for each word in the scrabble dictionary.

var dict = {};

//ajax call to read dictionary.txt file
$.get("dictionary.txt", parseResults);


function parseResults(txt) {
var words = txt.split( "\n");

  for (var i=0; i < words.length; i++){
      dict[ words[i] ] = true;
  }

  console.log(dict.AAH);
  console.log(dict);

  if (dict.AAH == true) {
     console.log('dict.AAH is true!');
  }


}

(updated code to use an earlier answer from Phil)

I can’t figure out why dict.AAH is returning undefined, but the dict object looks fine in the console. Screenshots from Firebug below.

Console:

Drilled down into “Object { }”

How can I check a given word (“AAH”, in this case) and have it return true if it is a property in the dict object defined as true?

• Live example
• Code on Github

Answer 1

The problem isn’t your code. You have invisible characters in your words, which you fail to clean up.

You can verify this by using this as your results parser

function parseResults(txt) {
  // clean the words when we split the txt
  var words = txt.split("\n")
                 .map($.trim)
                 .splice(0,3); // Keep only 3 first ones

  if(btoa(words[2]) !== btoa('AAH')){ // Compare in Base64
    console.log('YOU HAVE HIDDEN CHARS!');
  }

}

And you can fix it by whitelisting your characters.

function parseResults(txt) {
  // clean the words when we split the txt
  var words = txt.split("\n").map(function(el){
    return el.match(/[a-zA-Z0-9]/g).join('');
  });

  for (var i=0; i < words.length; i++){
      dict[ words[i] ] = true;
  }

  console.log(dict.AAH);
  console.log(dict);

  if (dict.AAH == true) {
     console.log('dict.AAH is true!');
  }
}

I would recommend cleaning it up on the server side since running regex on every element in an array as large as seen in your live site might cause performance issues.