DEV Community

Robert Mion
Robert Mion

Posted on

Why 'Find the Longest Word in a String' is a great beginner JavaScript exercise

One of my mentees is struggling with this FreeCodeCamp exercise.

  • I recall struggling, too.
  • If we did, then you might be as well.

I hope this post helps you feel less alone in your quest to master frontend development

Want to try it first? Here is a direct link to the exercise

The desired outcome is clear:

  • Return the length of the longest word in the provided sentence.

After clicking to 'Get a hint', the related forum post conceals four possible solutions:

  1. The first matches the approach I took
  2. The second uses one of the popular higher-order functions available on all arrays
  3. The third is concise, eloquent, and uses another popular higher-order function available on arrays
  4. The fourth uses recursion

Let's review the task programmatically:

  • Given a string
  • Return a number
  • Derived from a comparison of parts of the string

Solution 1 is the most imperative: lots of code, unnecessary variables, and the typical for loop

  • The string is split into an array of words
  • A variable is declared and initialized to track the length of the longest word
  • The array is iterated and each time the length of the word is compared to and, if greater than, set as the new value of the tracking variable
  • The value of the tracking variable is returned, as it should now store the number corresponding to the length of the longest word in the string

Solution 2 works the exact same way, but much more declaratively

  • The result of a lengthly expression is returned...
  • The string is split into an array of words
  • The reduce method is invoked with two arguments: an anonymous function and an initial accumulator value set to 0
  • The anonymous function uses Math.max to compare the accumulated value with the length of the word in the current iteration of the loop
  • The value of the accumulator is returned, as it should now store the number corresponding to the length of the longest word in the string

Solution 3 uses all the right ingredients to make a delicious and hearty JavaScript soup, and fits easily on one line

  • The result of a relatively short expression is returned...
  • Math.max is invoked. It will receive multiple arguments as a result of the ensuring expression.
  • The original string is split into an array of words
  • That array is transformed using map: each word is replaced with a number - the word's length
  • The mutated array of numbers is spread so that each number is passed as an argument to Math.max
  • The number corresponding to the length of the longest word in the string is returned once again

Solution 4 uses recursion. Give it a round of applause. Let's wrap this post up.

This exercise wonderfully demonstrates the versatility of JavaScript.

As a beginner, you can build small programs that serve your needs. You'll likely write more code than is necessary, but that's a trade-off of learning and practicing.

As you become more familiar with JavaScript's built-in capabilities and object methods, your small programs will get even smaller and become far more readable.

If you haven't used FreeCodeCamp.org, I encourage you to try it.

  • It's free.
  • It will teach you test-driven development in addition to the fundamentals of frontend development.
  • And it will make you think critically, struggle valiantly, and reward you handsomely for your efforts

Top comments (0)