Training: JavaScript Data Types

Use the JavaScript console in your browser to solve the challenges. Press command + option + J to open the console in Chrome. Feel free to also record your responses in a file, but make sure you test them in the console!

Strings

1. Store your first name in a variable.
2. Concatenate your first name with your last name, and store the result in another variable.
3. Use the String split method to turn your string variable from challenge #2 into an array.

Arrays

1. An array called foods holds the names of my top 20 favorite foods, starting with the best food. How can you find my fifth favorite food?

   answer

   ```js foods[4] ```

2. Starting from the existing friends variable below, change the element that is currently "Elizabeth" to "Liz".

   const friends = [
     "Moe",
     "Jane",
     "Emma",
     "Elizabeth",
     "Abanov",
     "Lycia"
   ];

   answer

   ```js friends[3] = "Liz"; ```

3. Using array methods, add your name to the end of the friends array, and add another name to beginning.

   hint

   Look up array methods `push` and `unshift`.
   answer

   ```js friends.push("Me!"); friends.unshift("Someone else!"); ```

4. Stretch: We have two lists of friends below. Use array methods to combine them into one alphabetically-sorted list.

   const myFriends = [
     "Rickon",
     "Meera",
     "Hodor",
     "Jojen",
     "Osha",
     "Rickard",
     "Maester"
   ];
   
   const yourFriends = [
     "Bilbo",
     "Boromir",
     "Elrond",
     "Faramir",
     "Frodo",
     "Gandalf",
     "Legolas",
     "Pippin"
   ];

   hint

   Look up array methods `concat` and `sort`.
   answer

   ```js const allFriends = myFriends.concat(yourFriends); allFriends.sort(); ```

Objects

1. Write out an object literal to represent the data below.

   John, Doe, 36, 1234 Park St.
   

   sample answer

   ```js const jd = { firstName: "John", lastName: "Doe", age: 36, address: { street: "Park St.", number: 1234 } } ```

2. How would you represent the following data using a combination of object literals and arrays? (You can describe a strategy without typing or writing out the whole thing.)

   Jane, Doe, 32, 1239 Spark St.
   Mary, Doe, 31, 1231 Spark St.
   Greg, Doe, 34, 1214 Park St.
   Harriet, Doe, 32, 1324 Park St.
   

   answer

   Structure each object like the one I made for the last question. Then put all of the objects inside one array.

More Complex Structures

Copy the following clubs variable into your console.

const clubs =  [
	{
    	name: 'Yearbook',
        students: [
	        { first: 'Joe', last: 'Lakin' },
	        { first: 'Evalyn', last: 'Bradtke' },
			{ first: 'Samuel', last: 'Black' }
	    ],
        teacher: 'James Friar'
    },
    {
    	name: 'Jazz Band',
        students: [
			{ first: 'Douglas', last: 'Wisoky' },
        	{ first: 'Cora', last: 'Thompson' },
			{ first: 'Samuel', last: 'Ziemann' },
			{ first: 'Alana', last: 'Cortez'}
	    ],
        teacher: 'Luther Richards'
    },
    {
    	name: 'Swim Team',
        students: [
        	{ first: 'Cora', last: 'Thompson' },
			{ first: 'Samuel', last: 'Black' },
			{ first: 'Alana', last: 'Cortez'},
			{ first: 'Joe', last: 'Lakin' }
	    ],
        teacher: 'Carol Darby'
    }
];

Start from the clubs variable.

1. Find and console.log the following:

   • the array that contains all the student club data

     answer

     `console.log(clubs);`

   • the number of clubs

     answer

     `console.log(clubs.length);`

   • the object that contains all of the information for the jazz band

     answer

     `console.log(clubs[1]);`

   • the teacher of the first club

     answer

     ```js console.log(clubs[0]['teacher']); // bracket notation, or console.log(clubs[0].teacher); // dot notation ```

   • the array of students in the jazz band

     answer

     ```js console.log(clubs[1]['students']); console.log(clubs[1].students); ```

   • the last name of the second student on the swim team

     answer

     ```js console.log(clubs[2]['students'][1]['last']); console.log(clubs[2].students[1].last); ```

2. Create an object literal representing a student with your name, and assign it to a variable.

   answer

   `const me = { first: 'Bob', last: 'Loblaw' };`

3. Add yourself to one of the clubs as a student member.

   answer

   ```js // joining the swim team clubs[2]['students'].push(me); // or clubs[2].students.push(me); ```

4. Create an object literal representing a new club, and assign it to a variable. Make sure it has values for name, students, and teacher.

   answer

   ```js const lawClub = { name: 'Legal Eagles', students: [], teacher: 'Abby Fuentes' }; ```

   • Use an array method to add your new club to the array of clubs.

     answer

     ```js clubs.push(lawClub); ```

   • Add yourself as a student in the new club.

     answer

     ```js clubs[3]['students'].push(me); // or clubs[3].students.push(me); ```

5. Update Samuel Black's first name to Sam everywhere it occurs. Hint: there is not a great shortcut to do this.

   answer

   ```js clubs[0]['students'][2]['first'] = 'Sam'; clubs[2]['students'][1]['first'] = 'Sam'; clubs[0].students[2].first = 'Sam'; clubs[2].students[1].first = 'Sam'; ```

6. Oops, the school is losing extracurricular funding. Use an array method to remove one of the clubs from the array.

   answer

   `clubs.shift(); // goodbye yearbook!`