Goal: Practice using
Array.prototype.forEach() to solve the problems below.
Remember, understanding is the goal here. You're absolutely not expected to complete everything listed on this page. In fact, often we intentionally include more content than can reasonably be completed in a single day. This allows students an opportunity to later review concepts without having to repeat exercises they've previously done. Focus on understanding the concepts, not on speed.
Work through as many of the following exercises that you have time for during class.
Hints: To do this, build an array of the inputted items. (Make sure you don't include any blank fields.) Sort the array in alphabetical order. Make a new array with each entry uppercased (don't just uppercase them when you display them). Then, display the sorted list of things as list items inside a
<ul>. Explore the MDN documentation on arrays to research what method might be used to sort arrays.
Array.prototype.join()it back together into a string, and display it to the user.
Array.prototype.forEach()loop within another
Array.prototype.forEach()loop to build an array representing a deck of cards. A deck consists of 52 cards — 13 ranks in each of 4 suits.
The start of your output should look something like this:
Create a website that lets users input a block of text. The application will then return a list of all the unique words and how many times they appeared.
For example, if the user inputs "hello world world", the page should show:
- hello 1 - world 2
If you finish, and feel comfortable with
Array.prototype.forEach() loops, try to complete the above exercise but instead order the list by the number of appearances — greatest to least. This is challenging — but a great way to exercise your problem-solving skills.
Another challenge: for words that appear the same amount of times, order by which word appeared first.