Slide 1

Accessing an Object

As with many things in JavaScript, creating an object often begins with defining and initializing a variable. Try entering the following line below the JavaScript code that's already in your file, then saving and refreshing:

const person = {};

Now open your browser's JavaScript console, enter person into it, and press Enter / Return. You should get a result similar to one of the below lines:

Slide 2

Congratulations, you've just created your first object. Job done! But this is an empty object, so we can't really do much with it. Let's update the JavaScript object in our file to look like this:

  const person = {
      name: ['Bob', 'Smith'],
      age: 32,
      gender: 'male',
      interests: ['music', 'skiing'],
      bio: function() {
        alert(this.name[0] + ' ' + this.name[1] + ' is ' + this.age + ' years old. He likes ' + this.interests[0] + ' and ' + this.interests[1] + '.');
    },
    greeting: function() {
       alert('Hi! I\'m ' + this.name[0] + '.');
    }
  };

Slide 3

After saving and refreshing, try entering some of the following into the JavaScript console on your browser devtools:

    person.name
    person.name[0]
    person.age
    person.interests[1]
    person.bio()
    person.greeting()

Slide 4

You should be able to see below changes in your console

Slide 4 DownWards

Slide 4 DownWards