DEV Community

Bridget Amana
Bridget Amana

Posted on

2 1 1 1 1

Building a Word Unscrambler with JavaScript (part 2)

In my last article, I was stuck on a little bug. I thought I had fixed it, but well... let's just say I had an "oops" moment. All that was missing was the logical NOT operator “!” in the if condition like this:

if (!uniquePermutations.includes(newPermutation)) { 
    uniquePermutations.push(newPermutation);
}
Enter fullscreen mode Exit fullscreen mode

I added it and now, we move on to the next problem.

The Length Issue

After generating all the permutations, I noticed something else. My word unscrambler was only giving me permutations that were exactly the length of the input word. So if I typed in "wood," I got permutations like "doow" and "odwo" but never shorter words like "wo" or "ow." That's not what I wanted.

I needed to find a way to generate all possible combinations, not just those of the same length as the input word.

So, here’s what I did:

function generatePermutations(inputString) {
    const uniquePermutations = [];

    function generateUniquePermutations(arr, currentIndex, length) {
        if (currentIndex === arr.length - 1) {
            const newPermutation = arr.slice(0, length).join("");
            if (!uniquePermutations.includes(newPermutation)) {
                uniquePermutations.push(newPermutation);
            }
        } else {
            for (let i = currentIndex; i < arr.length; i++) {
                [arr[currentIndex], arr[i]] = [arr[i], arr[currentIndex]];
                generateUniquePermutations([...arr], currentIndex + 1, length);
            }
        }
    }

    for (let length = 2; length <= inputString.length; length++) {
        generateUniquePermutations(inputString.split(""), 0, length);
    }

    return uniquePermutations;
}

console.log(generatePermutations('wood'));
Enter fullscreen mode Exit fullscreen mode

Breaking It Down:

I modified the generateUniquePermutations function to accept a length argument, which slices the array and ensures it generates permutations of different lengths. I also added a loop that starts at 2 and goes up to the full length of the input word.

Categorizing by Length

Once I had all my word permutations, I thought it would be much nicer (and way easier on the eyes) if I could categorize them by word length. So here’s how I broke them down:

function categorizeByLength(combinations) {
    const categorized = {};
    combinations.forEach(word => {
        const length = word.length;
        if (!categorized[length]) {
            categorized[length] = [];
        }
        categorized[length].push(word);
    });
    return categorized;
}
Enter fullscreen mode Exit fullscreen mode

This function takes the list of permutations, groups them by their length, and returns an object where each key is a word length (2, 3, 4, etc.), and each value is an array of words of that length.

Displaying the Results

Next up, I wanted these categorized results to actually show up nicely in the browser. I wrote a function that dynamically creates sections in the HTML for each word length, then lists all the words under those sections.

function displayResults(categorizedWords) {
    const resultsContainer = document.getElementById('resultsContainer');
    resultsContainer.innerHTML = '';

    for (const [length, words] of Object.entries(categorizedWords)) {
        const section = document.createElement('div');
        section.className = 'result-section';

        const header = document.createElement('h2');
        header.textContent = `${length}-Letter Words`;
        section.appendChild(header);

        const wordList = document.createElement('ul');
        words.forEach(word => {
            const listItem = document.createElement('li');
            listItem.textContent = word;
            wordList.appendChild(listItem);
        });
        section.appendChild(wordList);
        resultsContainer.appendChild(section);
    }
}
Enter fullscreen mode Exit fullscreen mode

This is what we have

Image description

Next up? I need to work on filtering out the invalid words. Right now, I’m getting all sorts of gibberish, and I only want real, meaningful words. Still stick around 🙃

Top comments (0)

Postmark Image

Speedy emails, satisfied customers

Are delayed transactional emails costing you user satisfaction? Postmark delivers your emails almost instantly, keeping your customers happy and connected.

Sign up