1 00:00:00,510 --> 00:00:04,330 JavaScript objects let you store multiple pieces of information 2 00:00:04,330 --> 00:00:05,700 in a single variable. 3 00:00:05,700 --> 00:00:08,350 In this way objects are similar to arrays. 4 00:00:08,350 --> 00:00:13,525 One difference is that arrays use a number or index value to access an array element, 5 00:00:13,525 --> 00:00:17,210 while objects use a key, or property name to access a property. 6 00:00:18,220 --> 00:00:21,080 For example, if you had an array named students, 7 00:00:21,080 --> 00:00:25,840 you'd get to the first element using an index value of 0, like this. 8 00:00:25,840 --> 00:00:30,650 Let's look at an example student object with the properties name and age. 9 00:00:30,650 --> 00:00:33,920 There are two different ways to access the value inside an object. 10 00:00:33,920 --> 00:00:37,195 First, you can access the value of the name property like this. 11 00:00:37,195 --> 00:00:41,500 You use the same type of square brackets you use with an array, but 12 00:00:41,500 --> 00:00:45,670 instead of providing a number, you provide the property's name as a string. 13 00:00:45,670 --> 00:00:47,030 There's another easier and 14 00:00:47,030 --> 00:00:51,340 more common way to access properties of an object called, dot notation. 15 00:00:51,340 --> 00:00:52,830 You don't need square brackets, and 16 00:00:52,830 --> 00:00:55,460 you don't need to put quote marks around the properties' name. 17 00:00:55,460 --> 00:00:59,160 You add a dot after the object name followed by the property name. 18 00:00:59,160 --> 00:01:02,880 You can use either the brackets or dot notation to access a property value, but 19 00:01:02,880 --> 00:01:05,070 you'll find that dot notation is more common, 20 00:01:05,070 --> 00:01:06,750 and that's what I'll use in this course. 21 00:01:08,220 --> 00:01:11,720 Since an object is used to store properties and values, 22 00:01:11,720 --> 00:01:16,050 one way you might think of an object is like a container, or tidy package of data. 23 00:01:16,050 --> 00:01:20,420 The properties are like a collection of variables contained inside the object. 24 00:01:20,420 --> 00:01:24,820 This helps keep related data group inside one easily accessed unit, 25 00:01:24,820 --> 00:01:27,700 which simplifies handling and maintaining data. 26 00:01:27,700 --> 00:01:30,510 All right, let's get back to working with JavaScript objects. 27 00:01:30,510 --> 00:01:35,130 The object you created earlier, in object.js, has five properties with 28 00:01:35,130 --> 00:01:39,630 different types of values, strings, a number, boolean, and an array. 29 00:01:39,630 --> 00:01:42,510 Let's use the data in this object. 30 00:01:42,510 --> 00:01:47,760 I'll create a new variable named message and assign it a template literal. 31 00:01:47,760 --> 00:01:53,650 Inside the backticks add the message, Hi, I'm ${}. 32 00:01:53,650 --> 00:01:59,490 Remember, the ${} inserts, or interpolates a value into a string. 33 00:01:59,490 --> 00:02:03,900 Now I'll use dot notation to access the name property and 34 00:02:03,900 --> 00:02:06,770 insert its value into the string. 35 00:02:06,770 --> 00:02:12,415 The name of the object is person, so to access the value 36 00:02:12,415 --> 00:02:17,584 of the name property, I'll type person.name. 37 00:02:17,584 --> 00:02:22,080 Let's log this message to the console using console.log. 38 00:02:22,080 --> 00:02:25,970 I'll save the file, and preview index.html in the browser. 39 00:02:25,970 --> 00:02:29,240 The message, Hi, I'm Edward, displays in the console. 40 00:02:29,240 --> 00:02:32,950 Notice how the object property works just like any other variable. 41 00:02:34,480 --> 00:02:38,120 Let's access another property and display it in the string. 42 00:02:38,120 --> 00:02:43,714 Between the backticks, right, 43 00:02:43,714 --> 00:02:49,118 I live in ${person.city}. 44 00:02:49,118 --> 00:02:52,500 This returns the message, Hi, I'm Edward, I live in New York.