Object.create usage in Javascript - Cheat Sheet & Quick Revision

Recall & Review

beginner

What does Object.create() do in JavaScript?

Object.create() creates a new object with the specified prototype object and properties. It lets you set the prototype of the new object directly.

beginner

How do you create an object with Object.create() that inherits from another object?

<p>Pass the object you want to inherit from as the first argument to <code>Object.create()</code>. For example: <code>const child = Object.create(parent);</code></p>

intermediate

What is the difference between Object.create(null) and {}?

Object.create(null) creates an object with no prototype, so it doesn't inherit any properties like toString. {} creates an object that inherits from Object.prototype.

intermediate

Can you add properties when creating an object with Object.create()?

Yes, the second argument of Object.create() lets you define properties with descriptors. For example: Object.create(proto, { prop: { value: 42, writable: true, enumerable: true, configurable: true } }).

intermediate

Why might you use Object.create() instead of a constructor function?

It gives you direct control over the prototype chain without needing to define a constructor. This can be simpler for creating objects that inherit from others without extra setup.

What is the first argument to Object.create()?

A A constructor function

B An array of property names

C The prototype object for the new object

D A string representing the object type

The first argument sets the prototype of the new object created by Object.create().

What does Object.create(null) create?

A An object with no prototype

B An empty array

C An object with default properties

D A function object

Object.create(null) creates an object that does not inherit from Object.prototype.

How can you add properties when using Object.create()?

A By calling <code>addProperty()</code> method

B By passing a second argument with property descriptors

C By passing an array of values as the second argument

D You cannot add properties during creation

The second argument to Object.create() is an object defining property descriptors.

Which of these is true about objects created with Object.create()?

A They inherit from the object passed as the first argument

B They always have <code>Object.prototype</code> as prototype

C They cannot have methods

D They are frozen by default

The new object inherits from the prototype object passed as the first argument.

Why use Object.create() instead of a constructor function?

A Because it automatically adds methods

B Because it runs faster

C Because it creates arrays

D To directly set the prototype without defining a constructor

Object.create() lets you create an object with a specific prototype without needing a constructor function.

Explain how Object.create() works and how it is used to set an object's prototype.

Think about how inheritance works in JavaScript objects.

Describe the difference between an object created with Object.create(null) and a normal object literal {}.

Consider what properties and methods are available on each.

Practice

1. What does Object.create(proto) do in JavaScript?

easy

A. Deletes the proto object and returns a new one.

B. Creates a new object with proto as its prototype.

C. Copies all properties from proto into a new object.

D. Creates a new array from the proto object.

Solution

1. Step 1: Understand Object.create purpose

   Object.create(proto) creates a new object that uses proto as its prototype, meaning it inherits properties and methods from proto.

2. Step 2: Differentiate from copying

   It does not copy properties but links the new object to proto via the prototype chain.

3. Final Answer:

   Creates a new object with proto as its prototype. -> Option B

4. Quick Check:

   Object.create(proto) sets prototype = proto [OK]

Hint: Remember: Object.create sets prototype, does not copy properties [OK]

Common Mistakes:

• Thinking it copies properties instead of setting prototype
• Confusing with Object.assign or spread operator
• Assuming it creates arrays or deletes objects

2. Which of the following is the correct syntax to create an object child with prototype parent using Object.create?

easy

A. const child = Object.create = parent;

B. const child = new Object.create(parent);

C. const child = Object.create(parent);

D. const child = Object.create(parent)();

Solution

1. Step 1: Recall Object.create syntax

   The correct syntax is Object.create(proto) which returns a new object with proto as prototype.

2. Step 2: Check each option

   const child = Object.create(parent); uses correct syntax. const child = Object.create = parent; wrongly assigns. const child = new Object.create(parent); wrongly uses new. const child = Object.create(parent)(); tries to call the result as a function.

3. Final Answer:

   const child = Object.create(parent); -> Option C

4. Quick Check:

   Correct syntax = Object.create(proto) [OK]

Hint: Use Object.create(proto) without new or extra parentheses [OK]

Common Mistakes:

• Using new with Object.create
• Assigning Object.create to a variable incorrectly
• Calling the result as a function

3. What will be the output of this code?

const parent = { greet() { return 'Hello'; } };
const child = Object.create(parent);
console.log(child.greet());

medium

A. 'Hello'

B. undefined

C. TypeError

D. '' (empty string)

Solution

1. Step 1: Understand prototype inheritance

   child is created with parent as prototype, so it inherits greet method.

2. Step 2: Calling child.greet()

   Since greet exists on parent, child.greet() calls that method and returns 'Hello'.

3. Final Answer:

   'Hello' -> Option A

4. Quick Check:

   Inherited method call returns 'Hello' [OK]

Hint: Object.create links prototype, so inherited methods work [OK]

Common Mistakes:

• Expecting undefined because child has no own greet
• Thinking it causes error without own method
• Confusing prototype chain lookup

4. Find the error in this code snippet:

const proto = { x: 10 };
const obj = Object.create();
console.log(obj.x);

medium

A. Object.create() requires a prototype argument.

B. Cannot access property x on obj.

C. Syntax error in Object.create call.

D. obj.x is undefined because x is not own property.

Solution

1. Step 1: Check Object.create usage

   Object.create() without arguments is invalid because it requires a prototype object or null.

2. Step 2: Understand consequence

   Since no prototype is given, this causes a TypeError or unexpected behavior.

3. Final Answer:

   Object.create() requires a prototype argument. -> Option A

4. Quick Check:

   Object.create(proto) needs proto argument [OK]

Hint: Always pass prototype or null to Object.create [OK]

Common Mistakes:

• Calling Object.create without arguments
• Expecting default prototype if none given
• Ignoring TypeError from missing argument

5. How can you create an object child with prototype parent and add a new property age with value 25 during creation using Object.create?

hard

A. const child = Object.create(parent, { age: 25, writable: true });

B. const child = Object.create(parent); child.age = 25;

C. const child = Object.create(parent, { age: 25 });

D. const child = Object.create(parent, { age: { value: 25, writable: true, enumerable: true, configurable: true } });

Solution

1. Step 1: Understand Object.create second argument

   The second argument to Object.create is a property descriptor object where each property is defined with descriptors like value, writable, enumerable, and configurable.

2. Step 2: Check each option

   const child = Object.create(parent, { age: { value: 25, writable: true, enumerable: true, configurable: true } }); correctly uses property descriptor for age. const child = Object.create(parent); child.age = 25; adds property after creation, not during. Options A and C use incorrect descriptor syntax.

3. Final Answer:

   const child = Object.create(parent, { age: { value: 25, writable: true, enumerable: true, configurable: true } }); -> Option D

4. Quick Check:

   Use property descriptors in second argument [OK]

Hint: Use property descriptors object as second argument to add properties [OK]

Common Mistakes:

• Adding properties directly in second argument without descriptors
• Adding properties after creation instead of during
• Using wrong syntax for property descriptors