Prep: Objects and loops

Session goals

By the end of this session students will be able to do the following with JavaScript:

• Create objects with properties to hold data
• Create arrays
• Iterate over objects, arrays and strings
• Manipulate objects, arrays, and strings with methods and iteration

Videos and readings

Please set aside time to watch the following priority videos before class.

Together the videos are 65 minutes.

If you learn best by reading, check out chapter 4 of Eloquent JavaScript.

Priority

JavaScript Tutorial #21 | Object Literal Basics, 9m 30s, Anagh Technologies Inc. (Nirmal Joshi), YouTube, 27 Mar 2020.

#14 Template Literals, 8m 19s, Dev Dreamer (Amit), YouTube, 1 Mar 2021.

#15 String methods, 9m 25s, Dev Dreamer (Amit), YouTube, 2 Mar 2021.

#27 For...in loop, 10m 53s, Dev Dreamer (Amit), YouTube, 19 Mar 2021.

#28 For...of loop, 6m 56s, Dev Dreamer (Amit), YouTube, 19 Mar 2021.

#29 How to use JS arrays, 10m 49s, Dev Dreamer (Amit), YouTube, 21 Apr 2021.

#30 How to use JS array methods, 19m 08s, Dev Dreamer (Amit), YouTube, 30 Apr 2021.

Data Structures: Objects and Arrays, chapter from book Eloquent JavaScript, 3rd ed. (2018), Marijn Haverbeke

Also recommended

#25 How to use the JS For Loop, 11m 43s, Dev Dreamer (Amit), YouTube, 16 Mar 2021.

#31 JS Array Iterator Methods, 18m 37s, Dev Dreamer (Amit), YouTube, 7 May 2021.

What is Object oriented programming, 12m 52s, procademy, YouTube, 4 May 2021.

Learning Functional Programming with JavaScript, 29m 56s, Anjana Vakil, JSUnconf, YouTube, 14 Jul 2016.

Check your understanding

What will be logged to the console?

1

function nameTag(name="Felicia") {
  return `Hello, my name is ${name}`
};
console.log(nameTag("Jack"));

2

function nameTag(name="Felicia") {
  return `Hello, my name is ${name}`
};
console.log(nameTag());

3

function nameTag(name="Felicia") {
  return `Hello, my name is ${name}`
};
console.log(nameTag);

4

function nameTag(name="Felicia") {
  return `Hello, my name is ${name}`
};

5

let names = ['Felicia', 'Jack']
for (let name of names) {
  console.log(name);
}

6

let player = {
  firstName: 'Felicia',
  username: 'winner',
}
player.username = 'happygolucky';
console.log(player.username);

7

let players = [
  {
    firstName: 'Felicia',
    username: 'winner',
  },
  {
    firstName: 'Jack',
    username: 'keanu99',
  }
]
for (let player of players) {
  console.log(players.username);
}