Intro to Arrays Solutions

Warm Up

In a CodePen, declare a variable for every scholar in the room. The variable names should be something like scholar1, scholar2, etc. and the values should be strings of their first names.

var scholar1 = "Pam";
var scholar2 = "Leta";
var scholar3 = "Hannah";
var scholar4 = "Amy";
var scholar5 = "Ellen Mary";
//etc.

The point of this exercise is to illustrate that this is time-consuming and inefficient. It is recommended that you lead a short discussion on the experience doing that, and try to tease that point out of scholars. This leads you into the benefit of using/need for collections.

Turn & Talk

Think about Instagram or TikTok - where might those applications use arrays?

  • List of followers
  • List of photos/videos for a given account/user
  • List of people who liked a given photo

If scholars aren’t sure yet - that’s ok! The point of this is just to get them thinking before you give over all the information about real-life use cases. The next section of the lesson does provide that information.

Try It: Creating Arrays

var dogs = ["Shih-Tzu", "German Shepard", "Corgi", "Bulldog"];

console.log(dogs[0]); // first element
console.log(dogs[3]); // last element
console.log(dogs[1]); // second element

Try It: Modifying Arrays

Practice accessing specific elements. Make sure to console.log() to verify you are accessing what you think you are.

var dogs = ["Shih-Tzu", "German Shepard", "Corgi", "Bulldog"];

console.log(dogs[0]); // first element
console.log(dogs[3]); // last element
console.log(dogs[2]); // third element

Now, add two new elements into your array. Use a console.log() to make sure they have been added.

var dogs = ["Shih-Tzu", "German Shepard", "Corgi", "Bulldog"];

dogs.push("Poodle");
dogs.push("Chihuahua");

console.log(dogs);
//-> ["Shih-Tzu", "German Shepard", "Corgi", "Bulldog", "Poodle", "Chihuahua"]

Lastly, remove at least two elements from your array. Again, make sure they have been successfully removed by printing to the console.

var dogs = ["Shih-Tzu", "German Shepard", "Corgi", "Bulldog", "Poodle", "Chihuahua"];

dogs.pop();
dogs.pop();

console.log(dogs);
//-> ["Shih-Tzu", "German Shepard", "Corgi", "Bulldog"]

Turn & Talk

Considering this section on selecting random elements from an array, answer the following questions with your partner:

  • What does Math.random() do?
    • Creates and returns a random decimal between 0 and 1
  • Why did we choose to multiply Math.random() by 20 for this example?
    • Because we wanted to generate a random number between 1-20. So we first created a random decimal, then multiplied
  • What does Math.floor() do?
    • Rounds a decimal down to the nearest whole number
  • Why do we have to pass an argument, or put a number inside the parenthesis for Math.floor()?
    • The argument is telling Math.floor() what decimal needs to be rounded!
  • Is it possible for this function to ever return the same number? Why or why not?
    • It is possible; this isn’t a strategy to generate unique numbers.

Practice: Arrays

Declare a variable called following that stores an array of your top five favorite accounts to follow on social media, in strings.

var following = ["Alfie the Alpaca", "Cassidy Williams", "Costco Does It Again", "mr pokee", "kunchevsky"];

Change the value of at least one of the elements in the array

following[0] = "Athena the Shih-Tzu"

Add a new account to the array

following.push("Oscar and Sodie");

Remove the last account from the array

following.pop();

Print the value of the third element of the array

console.log(following[2]);

Change the value of another element in the array

following[4] = "Pop Fit Clothing";

Add another account to the array

following.push("Cody Rigsby");

Print the value of the first element of the array

console.log(following[0]);

Print one account to the console, at random.

var random = Math.random() * following.length;
var rounded = Math.floor(random);
console.log(following[rounded]);

Spicy Challenge: Write a function that takes in one argument, a string. If the string is “happy”, output a randomly generated sentence about being happy. If the string is “ok”, output a randomly generated sentence about being ok. If the string is “sad”, output a randomly generated sentence to cheer someone up. You will need to use a function, conditional, multiple arrays, and have to generate a random number.

var happyResponses = ["Whoohoo", "You Go!", "Yay!"];
var okResponses = ["Meh, I get it.", "Want to hang out?", "Tomorrow will be better?"];
var sadResponses = ["Aww I'm sorry", "Cheer up buddy", "do you need anything?"];

function emotionalResponse(emotion) {
  var random = Math.random() * 3;
  var randomIndex = Math.floor(random);

  if (emotion === "happy") {
    console.log(happyResponses[randomIndex]);
  } else if(emotion === "ok") {
    console.log(okResponses[randomIndex]);
  } else {
    console.log(sadResponses[randomIndex]);    
  }
}

emotionalResponse("happy");
// => on of the three strings in happyResponses