Goal: In the lessons on arrays, we learned:
- Arrays can contain numbers, strings, variables, expressions and other arrays.
- Arrays have methods like
- We can access (or edit) an element from an array using bracket notation.
- How can we use square bracket notation to isolate a single element in an array? What does this notation look like?
- What is the difference between
Play around with arrays of your own by completing each of the following in the DevTools console:
- Make an array of your siblings' names or your favorite movie characters' names.
- Make an array of your parents' names.
- Combine these two arrays using
- Add your pets' names using
- Reverse the order of the array. To do this, research array methods on MDN that perform reversing functionality
- Access one of your parents' names using the square bracket notation.
- Update the name of one of your parents using the index and square bracket notation.
- Check out methods from the MDN (stick to using instance methods). Each person in your pair or group should pick one new array method to try.
Favorite Things Webpage
When you're comfortable using arrays in the console, move on to implementing them into a full project:
- Build a page with a form containing input fields where users may enter several of their favorite things.
- Then, write code that gathers each of these form input values and places them into one array.
- After this is done, use your site to practice targeting and moving elements between arrays:
- Use square bracket notation to access the second, first, and third elements of the original array of favorite things.
- Then, use
Array.prototype.push() to add only these elements (2nd, 1st, and 3rd) to a brand new array.
- Finally, display this new array in your page's HTML as list items in a
<ul> tag. Use the
Element.prepend() methods to create and add elements to your webpage.