Accelerator Track One

JavaScript Arrays Drills

In this lab, you will practice creating and manipulating arrays in JavaScript. You’ll start by creating basic arrays, access elements, and then explore how to iterate over arrays using different types of loops. Finally, you’ll work with array methods and practice with an array of objects.

Instructions:

In arrays.js, complete each drill by writing the JavaScript code for the following tasks. Be sure to test your functions by invoking them and checking the console to ensure they work as expected.

---

Array Creation and Indexing

1. Create an array named colors with five colors of your choice.

2. Access and print the first and last elements of the colors array.

3. Modify the second element of the colors array to a new color.

---

Loops with Arrays

4. Use a regular for loop to print each element of the colors array on a new line.

5. Use a regular for loop to print the elements of the colors array in reverse order.

6. Use a while loop to print each element of the colors array.

7. Use a while loop to print the elements of the colors array in reverse order.

8. Use a for...of loop to print each element of the colors array.

---

Nested Arrays (Bonus)

9. Loop through the nested array using a for loop and create a sentence for each subarray.
   Example sentence: "This past January I went skiing in Aspen."

---

Array of Objects Practice

1. Create an array of objects named products. Each object should have a name, price, and inStock key.
   Example: { name: 'Shirt', price: 19.99, inStock: true }

2. Loop over the products array and print out the name and price of each product.

3. Use a conditional while iterating over the products array. If the product is inStock, print out the sentence:
   "The [product name] is available for [price]."

---

Array Methods Practice (Bonus: AI to help you learn and tackle these)

1. Use the push() method to add a new color to the colors array.

2. Use the pop() method to remove the last element from the colors array.

3. Use the slice() method to extract a portion of the colors array.

4. Use the splice() method to remove an element from the middle of the colors array.

5. Use the join() method to convert the colors array into a single string.

6. Use the indexOf() method to find the index of a specific color in the colors array.

7. Use the includes() method to check if a specific color is in the colors array.

8. Use the reverse() method to reverse the order of the elements in the colors array.

---

Super Bonus: Array Higher Order Methods (Use AI to help you learn and tackle these)

9. Use the sort() method to alphabetically sort the colors array.

10. Use the filter() method to create a new array containing only colors with more than five letters.

11. Use the map() method to convert each color in the colors array to uppercase.

---

Submission Instructions:

• Complete all drills in the file arrays.js.
• Test each drill by running your code and checking the output in the console.
• Push your completed work to your repository and submit the link on Google Classroom.
• Be prepared to explain how your code works during a follow-up discussion.

Good luck and happy coding! 🚀