Locked lesson.
About this lesson
What are objects, and how does JavaScript use them?
Exercise files
Download this lesson’s related exercise files.
Objects.docx58.8 KB Objects - Solution.docx
59 KB
Quick reference
Objects
Objects are similar to arrays but use name/value pairs instead of index numbers.
When to use
Use objects whenever you have more complex data to store, or when simple index numbers won't do the trick.
Instructions
Objects are similar to arrays but use name/value pairs instead of index numbers.
An object looks like this:
var customer = {
firstName: "John",
lastName: "Elder"
}
You call an object item like this:
customer.firstName;
or...
customer["firstName"];
Hints & tips
- Objects are similar to arrays
- Objects use name/value pairs instead of index numbers
- Objects use curly brackets instead of straight ones
- 00:04 So, we've talked about variables and we've talked about arrays, now it's time
- 00:08 to talk about objects and objects are very similar to both variables and arrays.
- 00:12 So, variables are containers with one item and arrays are containers with many items.
- 00:17 And they're numbered.
- 00:18 So we can call the third item in our array, or the fourth item,
- 00:22 or the zeroth item in our array.
- 00:24 Objects are very similar to arrays, but they aren't categorized by numbers.
- 00:28 Instead, objects have something called a name and a value pair.
- 00:32 So let's just jump in and build an object.
- 00:34 Let's think of a customer.
- 00:35 What kind of information might we have for our customer that we can list out?
- 00:39 Well, we can have first name, last name, email address, and let's say phone number.
- 00:44 Let's build a customer object.
- 00:46 So to do that, we just go var like we have in the past and give it a name.
- 00:50 I'm gonna call it Customer, and then equals, and for
- 00:54 an array we use these brackets like that.
- 00:57 For an object, we use curly braces, and you can do multiple lines.
- 01:01 So I'm just gonna start out like that.
- 01:03 So say we want a first name, and let's say "John", separate each item by a comma.
- 01:08 And let's go LastName "Elder" and
- 01:13 let's go email, and let's go I dunno,
- 01:17 phonenumber "111-222-333".
- 01:23 So this is an object, and you could see right off the bat it looks sort of like
- 01:27 an array, except for we have these different, instead of just one item we
- 01:32 have these sort of pairs, right, name and value pairs.
- 01:35 So you can access all this information by calling the name and
- 01:41 it's just objectName.property name.
- 01:45 That's the format to call it.
- 01:47 You call it the object name, which is customer and then the property name.
- 01:51 Each of these are names.
- 01:52 So first name, that's a name.
- 01:53 Last name, that's a name.
- 01:54 Email, that's a name.
- 01:55 Phone number, that's a property name.
- 01:57 To call this, specifically, we would just go- let's go document.write and
- 02:03 then call customer.firstname, save this and come back here.
- 02:11 Reload oops, misspelled customer.
- 02:13 Customer.firstname Boom, John.
- 02:18 There's another way to do it also.
- 02:20 You can go customer, and then brackets,
- 02:26 and inside this put quotation marks, and let's go "last name".
- 02:31 If we save this, and I'm just gonna paste this in here so
- 02:35 we can see right, save this, hit reload, elder.
- 02:40 So, this is a way to do it, but generally you just use this dot notation and
- 02:46 it's much easier, much easier to read, much easier to work with.
- 02:49 So most people don't use that other way, but
- 02:51 I thought I'd tell you about it just in case.
- 02:52 So, those are objects, remember we said that we can put all sort of things
- 02:56 into an array, you can also put put objects into an array.
- 02:59 So let's go ahead and just make an array real quick here.
- 03:03 So we just slap this in there.
- 03:05 We can go customer.firstname, right?
- 03:08 Now if we want to call this,
- 03:13 let's go document.write and call pizza.
- 03:20 Let's say we want the 0, 1, 2, third item, all right?
- 03:24 Save this, then reload.
- 03:28 So you can put objects in arrays.
- 03:29 That's kinda cool.
- 03:29 You'll see as we go along you will see that we can put all kinds of things into
- 03:33 arrays and we will see that as we go.
- 03:34 So those are objects and in the next video I wanna talk about functions.
Lesson notes are only available for subscribers.