Key Concepts

Review core concepts you need to learn to master this subject

Dot Notation for Accessing Object Properties

const apple = { color: 'Green', price: { bulk: '$3/kg', smallQty: '$4/kg' } }; console.log(apple.color); // 'Green' console.log(apple.price.bulk); // '$3/kg'

Properties of a JavaScript object can be accessed using the dot notation in this manner: object.propertyName. Nested properties of an object can be accessed by chaining key names in the correct order.

  1. 1
    It’s time to learn more about the basic structure that permeates nearly every aspect of JavaScript programming: objects. You’re probably already more comfortable with objects than you think, becau…
  2. 2
    Objects can be assigned to variables just like any JavaScript type. We use curly braces, {}, to designate an object literal: let spaceship = {}; // spaceship is an empty object We fill an object…
  3. 3
    There are two ways we can access an object’s property. Let’s explore the first way— dot notation, .. You’ve used dot notation to access the properties and methods of built-in objects and dat…
  4. 4
    The second way to access a key’s value is by using bracket notation, [ ]. You’ve used bracket notation when indexing an array: [‘A’, ‘B’, ‘C’][0]; // Returns ‘A’ To use bracket notation to access…
  5. 5
    Once we’ve defined an object, we’re not stuck with all the properties we wrote. Objects are mutable meaning we can update them after we create them! We can use either dot notation, ., or bracke…
  6. 6
    When the data stored on an object is a function we call that a method. A property is what an object has, while a method is what an object does. Do object methods seem familiar? That’s because y…
  7. 7
    In application code, objects are often nested— an object might have another object as a property which in turn could have a property that’s an array of even more objects! In our spaceship o…
  8. 8
    Objects are passed by reference. This means when we pass a variable assigned to an object into a function as an argument, the computer interprets the parameter name as pointing to the space in me…
  9. 9
    Loops are programming tools that repeat a block of code until a condition is met. We learned how to iterate through arrays using their numerical indexing, but the key-value pairs in objects aren’t …
  10. 10
    Way to go! You’re well on your way to understanding the mechanics of objects in JavaScript. By building your own objects, you will have a better understanding of how JavaScript built-in objects wor…
  1. 1
    Remember, objects in JavaScript are containers that store data and functionality. In this lesson, we will build upon the fundamentals of creating objects and explore some advanced concepts. So if …
  2. 2
    Objects are collections of related data and functionality. We store that functionality in methods on our objects: const goat = { dietType: ‘herbivore’, makeSound() { console.log(‘baaa’); …
  3. 3
    We saw in the previous exercise that for a method, the calling object is the object the method belongs to. If we use the this keyword in a method then the value of this is the calling object. Howev…
  4. 4
    Accessing and updating properties is fundamental in working with objects. However, there are cases in which we don’t want other code simply accessing and updating an object’s properties. When discu…
  5. 5
    Getters are methods that get and return the internal properties of an object. But they can do more than just retrieve the value of a property! Let’s take a look at a getter method: const person =…
  6. 6
    Along with getter methods, we can also create setter methods which reassign values of existing properties within an object. Let’s see an example of a setter method: const person = { _age: 37, …
  7. 7
    So far we’ve been creating objects individually, but there are times where we want to create many instances of an object quickly. Here’s where factory functions come in. A real world factory manu…
  8. 8
    ES6 introduced some new shortcuts for assigning properties to variables known as destructuring. In the previous exercise, we created a factory function that helped us create objects. We had to …
  9. 9
    We often want to extract key-value pairs from objects and save them as variables. Take for example the following object: const vampire = { name: ‘Dracula’, residence: ‘Transylvania’, preferen…
  10. 10
    In the previous exercises we’ve been creating instances of objects that have their own methods. But, we can also take advantage of built-in methods for Objects! For example, we have access to obje…
  11. 11
    Congratulations on finishing Advanced Objects! Let’s review the concepts covered in this lesson: * The object that a method belongs to is called the calling object. * The this keyword refers th…

What you'll create

Portfolio projects that showcase your new skills

Pro Logo

How you'll master it

Stress-test your knowledge with quizzes that help commit syntax to memory

Pro Logo