Module 6 · Objects & Prototypes

Objects

Beginner8m read5m practice13m total

ObjectsPropertiesReferencesFundamentals

Introduction

Objects are JavaScript's primary way to group data and behaviour. An object is a dynamic collection of properties, where each property key maps to a value, and values can be primitives, arrays, functions, or other objects.

Interviews use objects to test much more than syntax: reference identity, dot vs bracket access, own vs inherited properties, property enumeration, and how the prototype system starts to participate in a lookup.

Why This Matters

Almost every non-trivial JavaScript value you work with is an object or behaves like one: arrays, functions, dates, maps, class instances, errors, and plain records. A precise object mental model prevents common bugs such as accidentally mutating shared state, checking inherited properties as if they were own data, or assuming object equality compares structure.

Theory

Object literals

The most common way to create an object is an object literal: { name: 'Ada', score: 10 }. Each entry creates a property. Property keys are strings or symbols; numeric-looking keys are converted to strings.

Dot access vs bracket access

Use dot access when the property name is a valid identifier and known at author time: user.name. Use bracket access when the key is dynamic, contains punctuation, starts with a number, or is a symbol: user[key] or user['current-role'].

Objects are reference values

Assigning an object to another variable copies the reference, not the object itself. If const a = { count: 1 }; const b = a;, then a and b point at the same object. Mutating b.count also changes what a.count reads.

Own properties vs inherited properties

An object can have its own properties and also see properties through its prototype chain. The in operator checks both own and inherited properties. Object.hasOwn(obj, key) or Object.prototype.hasOwnProperty.call(obj, key) checks only the object itself.

Enumeration order in practice

Object.keys, Object.values, and Object.entries return own enumerable string-keyed properties. Modern JavaScript has a specified order: array-index keys first in numeric order, then other string keys in insertion order, then symbols for APIs that include symbols. Interview snippets usually depend only on simple insertion order for normal string keys.

Object equality

Objects compare by identity, not by shape. { a: 1 } === { a: 1 } is false because those are two different objects in memory.

Visual Diagrams

Object property lookup starts locally

user object
+---------------------+
| own name  -> 'Ada'  |
| own score -> 10     |
+---------------------+
          |
          v
prototype object
+---------------------+
| inherited toString  |
+---------------------+

A read checks own properties first, then walks to the prototype if needed.

Code Examples

Dot access, bracket access, and dynamic keys

Dot access is concise for known identifier-like keys. Bracket access is required for dynamic or non-identifier keys.

Loading…

Reference identity, not structural equality

Two object literals with the same properties are still different objects. Two variables can also point at the same object.

Loading…

Playground

Loading editor…

Console

Press Run to execute the code and see output here.

Output Prediction

Predict the output #1

javascript

1const user = { name: 'Ada' };
2const key = 'name';
3 
4user[key] = 'Grace';
5user.role = 'Engineer';
6 
7console.log(user.name);
8console.log('role' in user);
9console.log(Object.keys(user).join(','));

Predict the output #2

javascript

1const parent = { role: 'admin' };
2const child = Object.create(parent);
3child.name = 'Sam';
4 
5console.log(child.role);
6console.log(Object.prototype.hasOwnProperty.call(child, 'role'));
7console.log('role' in child);

Coding Exercises

Count only own enumerable properties

Easy

Implement countOwnEnumerable(obj) so it returns the number of own enumerable string-keyed properties on obj. It must not count inherited properties.

Interview Questions

1How do dot access and bracket access differ?

Dot access requires a property name that is a valid identifier and known in the source code, such as user.name. Bracket access evaluates an expression to get the key, so it supports dynamic keys, keys with punctuation, numeric-looking keys, and symbols: user[key], user['current-role'], or user[symbolKey].

Asked at:AmazonMicrosoft

Follow-ups

When would `obj.key` be wrong if you have a variable named `key`?
How do symbols change property access?

2What is the difference between `in` and `hasOwnProperty`?

The in operator checks whether a property can be found anywhere on the object or its prototype chain. hasOwnProperty checks only direct properties. In modern code, Object.hasOwn(obj, key) is often clearer and safer because it works even if the object has no normal prototype.

Asked at:GoogleMeta

Quiz

1. What does `{ a: 1 } === { a: 1 }` evaluate to?

2. Which API returns only own enumerable string-keyed properties?

Summary

Objects are dynamic collections of string or symbol keyed properties.
Dot access is for known identifier-like keys; bracket access is for dynamic or unusual keys.
Objects compare by reference identity, not by structural equality.
Own-property checks are different from prototype-chain checks.

Cheat Sheet

Create: { name: 'Ada' }

Read/write: obj.name, obj[key]

Own keys: Object.keys, Object.values, Object.entries

Own check: Object.hasOwn(obj, key) or Object.prototype.hasOwnProperty.call(obj, key)

Prototype-aware check: key in obj

Equality: objects compare by identity, not by shape.