Hello, and welcome! Are you ready to elevate your string manipulation skills in JavaScript? Today, we'll delve into a task that bolsters your comprehension of strings and enhances your creativity. The task involves splitting a string into words and then reversing each word as if reflected in a mirror. Does that sound interesting? Let's get started!

You're tasked with considering a string filled with words and writing a JavaScript function that accepts this string. The function should reverse the character order of each word and form a new string consisting of these reversed words.

Here's what you need to keep in mind:

• The input string will contain between 1 and 100 words.
• Each word in the string is a sequence of characters separated by whitespace.
• The characters can range from a to z, A to Z, 0 to 9, or even an underscore _.
• The provided string will neither start nor end with a space, and double spaces won't be present either.
• After reversing the words, your program should output a single string with the reversed words preserving their original order.

Example

Consider the input string "Hello neat javascript_lovers_123".

The function works as follows:

• Hello becomes olleH
• neat becomes taen
• javascript_lovers_123 becomes 321_srevol_tpircsavaj

Afterward, it forms a single string with these reversed words, producing "olleH taen 321_srevol_tpircsavaj".

Therefore, if you call reverseWords("Hello neat javascript_lovers_123"), the function should return "olleH taen 321_srevol_tpircsavaj".

Let's begin breaking this down!

Our first task is to separate the words in the sentence. In JavaScript, the split() method of the String object allows us to achieve this easily. The delimiter you'll use in the split() method is a single space " ". Here is a sample code to illustrate this:

JavaScript
Copy to clipboard
1let inputStr = "Hello neat javascript_lovers_123";
2let words = inputStr.split(" ");
3
4// Now the array 'words' holds all the words of the string
5console.log(words); // Output: [ 'Hello', 'neat', 'javascript_lovers_123' ]

Note that " " as the delimiter ensures that the string is split at each space, effectively separating the words.

Next, we need to reverse each word separated in the previous step. In JavaScript, we can use array methods to achieve this. The map() method is particularly useful here as it creates a new array populated with the results of calling a provided function on every element in the calling array. By applying map(), we can transform each word individually.

In our case, each word is:

1. Split into an array of characters using split('').
2. Reversed using the reverse() method.
3. Joined back into a string using the join('') method, which concatenates the reversed characters without any separators.

Here's the updated code illustrating this:

JavaScript
Copy to clipboard
1let reversedWords = words.map(word => {
2  let reversedWord = word.split('').reverse().join('');
3  console.log(reversedWord); // Prints each reversed word
4  return reversedWord;
5});
6
7// 'reversedWords' now contains the reversed words

Finally, we need to consolidate these reversed words into a single string, separated by spaces. We can achieve this using the join() method in JavaScript. Here's how we do that:

JavaScript
Copy to clipboard
1let finalStr = reversedWords.join(' ');

The join(' ') method will concatenate all the words in the array, separating them with spaces.

It remains for us to combine the code from the steps together in a function reverseWords and call it to test.

JavaScript
Copy to clipboard
1function reverseWords(inputStr) {
2    let words = inputStr.split(" ");
3    let reversedWords = words.map(word => word.split('').reverse().join(''));
4    return reversedWords.join(' ');
5}
6
7// Call the function
8console.log(reverseWords("Hello neat javascript_lovers_123")); // prints: 'olleH taen 321_srevol_tpircsavaj'

Well done! By completing this lesson, you've sharpened your proficiency in manipulating strings in JavaScript. You've improved especially in reversing the order of characters in a word. I hope you're feeling confident and excited about your JavaScript skills. Remember, mastering these skills requires frequent practice. Therefore, take some time to explore related problems and practice what you’ve learned. Enjoy the journey of learning!