Objects
An object keeps related values together under names: each property is a key and a value. Follow a nine-line script about one cat as it builds an object with curly braces, reads properties with a dot and with square brackets, changes one, adds one, deletes one and finds that a missing key reads as undefined.
5 quick questions
Pick an answer to see why. Your score saves with your progress.
01In const cat = { name: "Mochi", age: 3 };, what is age?
Each property is a key and a value, written key: value. age is the key; 3 is its value.
02const key = "color"; Which line reads the property whose name is stored in key?
Square brackets evaluate what is inside, so cat[key] becomes cat["color"]. cat.key and cat["key"] both look for a key literally named "key".
03cat was declared with const. What happens when you run cat.age = 4;?
const protects the variable, not the object. Changing, adding or deleting properties is allowed; cat = {} would throw a TypeError.
04After delete cat.age;, what does console.log(cat.age) print?
Reading a key an object does not have is not an error. It gives undefined.
05const box = { a: 1 }; box.b = 2; box.a = 5; What does console.log(box) show in Node?
box.b = 2 adds a new property after a; box.a = 5 changes the value of the existing a in place, so a keeps its first position.
Glossary
- Object
- A value that groups related values under names, written with curly braces: { name: "Mochi", age: 3 }.
- Property
- One entry of an object: a key and the value stored under it.
- Key
- The name of a property. Keys are strings (or Symbols); quotes are optional when the key is a simple name.
- Object literal
- Code that makes a new object by listing its properties inside curly braces.
- Dot notation
- Reading or writing a property with a fixed name after a dot, as in cat.name.
- Bracket notation
- Reading or writing a property whose name is the result of an expression, as in cat[key] or cat["fur colour"].
- delete
- An operator that removes a property, key and value, from an object: delete cat.age.
- undefined
- The value you get when you read a property that does not exist, among other things: JavaScript's "nothing here".
Notes and sources
- Property keys are strings (or Symbols, a special kind of value). You may leave the quotes off a key that is a valid name, like name or age; a key with a space or a dash needs quotes, as in { "fur colour": "grey" }.
- cat does not contain the object; it holds a reference to it. Two variables can refer to the same object, and a change made through one shows through the other. That is why const cat still lets you change, add and delete properties.
- Keys come out in the order they were added, except keys that look like whole numbers ("1", "2"), which always come first, smallest first.
- console.log prints an object in a readable form, not as code. Node prints { name: 'Mochi', color: 'grey' }; a browser console shows the same two properties, with a small arrow to open the object.
- The tray of named slots is a picture, not how an engine stores an object. Engines such as V8 use hidden shapes and fast lookups, but the result is the same as the picture: a set of key and value pairs.
- Every object made with { } also inherits a few properties, such as toString, from Object.prototype. They do not show in console.log(cat). Prototypes come later in the course.
Quiz Unlocks after the last step.