Objective
Extract out individual words from a hyphenated word.
Difficulty
Description
A hyphenated word is one that has the hyphen character (-
) in it. Some examples are awe-inspiring, strongly-typed, small-sized, one-by-one etc.
In this exercise, you have to create a program that asks the user to input a hyphenated word and then displays each constituent word out on the document, one-by-one.
Start by asking the user to enter a hyphenated word with the message 'Enter a hyphenated word:'.
Once the word is entered, extract out the constituent words from it, and print each on a new line.
Shown below is an example:
If the input value is invalid, alert 'Invalid input!' before asking the user to input again.
Hints
Hint 1
Use the split()
string method.
Hint 2
Call split('-')
on the input value to break it into an array of words.
New file
Inside the directory you created for this course on JavaScript, create a new folder called Exercise-14-Hyphenated-Words and put the .html solution files for this exercise within it.
Solution
The description clearly says to keep on asking the user to enter a hyphenated word unless the entered value is valid.
This reminds us of a loop, whose condition is True
and is terminated (using break
) only if the entered word is hyphenated.
Obviously, the loop's condition could directly be set to check the input value, but using True
is easier.
Anyways, now that we know that a loop is needed, let's set it up:
while (true) {
// code goes here
}
Inside the loop, we start off with the prompt()
function. The value input gets saved into the variable word
, since that value is a word:
while (true) {
var word = prompt('Enter a hyphenated word:');
}
If word
is hyphenated, we break out of this loop but obviously after making the required output:
while (true) {
var word = prompt('Enter a hyphenated word:');
if (word.indexOf('-') !== -1) {
// output code goes here
break;
}
}
For the output, word
is split into a list, at each hyphen (-
) using word.split('-')
, stored in words
, and then each element of this array output to the document using a for
loop:
while (true) {
var word = prompt('Enter a hyphenated word:');
if (word.indexOf('-') !== -1) {
var words = word.split('-');
for (var i = 0; i < words.length; i++) {
document.write(words[i] + '<br>');
}
break;
}
}
In this code, the string '<br>'
is necessary in the output in order to put each word on a new line.
If word
isn't hyphenated i.e. the if
conditional fails, we make an alert saying 'Invalid input!', after which the loop repeats itself, asking the user to input a word again:
while (true) {
var word = prompt('Enter a hyphenated word:');
if (word.indexOf('-') !== -1) {
var words = word.split('-');
for (var i = 0; i < words.length; i++) {
document.write(words[i] + '<br>');
}
break;
}
else alert('Invalid input!');
}
This completes our exercise!