Word Play 4

Step 1
In this lesson, we will be making a crossword helper

Crosswords are puzzles that require the player to make intersecting words by filling in squares with letter

Step 2
Let's use this crossword as an example where a helper website could be useful

Notice we are missing one more word, but have some hints on certain letters placed in the mystery word

Step 3
Our future project will be able to use the question mark symbol to represent a blank tile

It will then output any possible words that match the length and letters given

Step 4
The first thing we need to fix is for our program to recognize question marks as a special case

The program we have so far will tell us adding question marks is an invalid input, like so:

Step 5
Checking an ASCII table will let us know that the question mark has an ASCII value of 63
Step 6
Update the "isInvalid" function to treat question marks as a valid character

The if statement needs to check if it's not a lowercase letter AND (the part you need to fill in) it's NOT a question mark

Check Your Work
Step 7
Save your code

The question marks should now be valid input but they will be ignored when making anagrams

Step 8
Let's add an else if statement to the checkInput function to let us know if there's a question mark

The indexOf function will return -1 if there is no question mark in the input, so we check the opposite

Check Your Work
Step 9
Save your code

Adding a question mark should now be recognized that we will be doing the crossword helper

Step 10
The next part is to find all crossword solutions for the input

We will parse every letter of the input.

If it is a question mark, then we skip to the next letter. If not a question mark, then we confirm the letter matches the word's letter at the same index.

Step 11
Let's make a function that will check if a word is a crossword solution for an input

For now, we will only be checking if the length of the input and word is the same.

Add this code at the bottom of index.js:

Check Your Work
Step 12
Since the function is only checking the length, the console should show true
Step 13
Now add a for loop to compare every index of the input unless it's a question mark

The blacked out code is checking:

If the letter of the input and the letter of the word at the same index is NOT equal to each other, Then return false.

Check Your Work
Step 14
Try adding another console.log that should be incorrect to test the new function


Step 15
Let's now make a function that will make an array of all possible crossword solutions

Add this to the bottom of index.js:

Step 16
Let's now use the new function to display the anagrams of the input

This is very similar to how we displayed the anagrams, so look at that code if you need help on the challenge.

This code should be inside the checkInput function:

Check Your Work
Step 17
Save your code

We should now have all solutions appearing on the screen!

Step 18
We do have a problem when there is a lot of solutions that causes the text to run off the screen

Here's an example that will display all four lettered words:

Step 19
Make a function that will make a new line after every crossword solution

Hint: What is the string to make a new line tag for HTML?

Add this to the bottom of index.js:

Step 20
Now add use the function to display the crossword solutions neatly
Check Your Work
Step 21
The solutions should now be on separate lines

And we are now done with the lesson!

Step 22
The next lesson show you how to make a Scrabble/Words with Friends helper
Word Play 4 Info


MVCode Clubs

Created By



Word Play

Access Level


For Teachers and Schools

Teach coding to your students with MVCode Teach

MVCode offers an integrated product designed to teach coding to students.

Learn more about MVCode Teach