Object.create usage in Javascript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

What is the output of this code using Object.create?

Consider the following JavaScript code. What will be logged to the console?

Javascript

const parent = { greeting: 'Hello' };
const child = Object.create(parent);
child.greeting = 'Hi';
console.log(child.greeting);

A "Hi"

B "Hello"

C undefined

D TypeError

💡 Hint

Remember that properties set directly on the child object override those from the prototype.

The child object has its own 'greeting' property set to 'Hi', so it logs 'Hi'. The parent's 'greeting' is shadowed.

❓ Predict Output

intermediate

What does this code output when accessing inherited property?

Look at this code snippet. What will be the output of the console.log statement?

Javascript

const animal = { eats: true };
const rabbit = Object.create(animal);
console.log(rabbit.eats);

A true

B false

C undefined

D ReferenceError

💡 Hint

Object.create sets the prototype, so properties can be inherited.

The 'rabbit' object inherits 'eats' from 'animal', so it logs true.

❓ Predict Output

advanced

What is the output of this code with property descriptors?

Analyze this code. What will be printed to the console?

Javascript

const proto = { x: 10 };
const obj = Object.create(proto, {
  y: { value: 20, writable: false, enumerable: true, configurable: true }
});
obj.y = 30;
console.log(obj.y);

A undefined

B 30

C 20

D TypeError

💡 Hint

Writable: false means the property cannot be changed.

The property 'y' is not writable, so the assignment to 30 fails silently and 'y' remains 20.

❓ Predict Output

advanced

What error does this code raise?

What error will this code produce when run?

Javascript

const obj = Object.create(null);
console.log(obj.toString());

A ReferenceError: toString is not defined

B undefined

C [object Object]

D TypeError: obj.toString is not a function

💡 Hint

Object.create(null) creates an object with no prototype.

Since obj has no prototype, it does not have the toString method, causing a TypeError.

🧠 Conceptual

expert

Which option correctly creates an object with a prototype and a new method?

You want to create an object 'car' that inherits from 'vehicle' and adds a method 'drive'. Which code does this correctly?

A

const vehicle = { wheels: 4 };
const car = Object.create(vehicle);
car.drive = function() { return 'Driving'; };

B

const vehicle = { wheels: 4 };
const car = Object.create(vehicle, { drive: { value: function() { return 'Driving'; }, enumerable: true } });

C

const vehicle = { wheels: 4 };
const car = Object.create(vehicle, { drive: { value: () => 'Driving' } });

D

const vehicle = { wheels: 4 };
const car = Object.create(vehicle, { drive: () => 'Driving' });

💡 Hint

Remember that the second argument of Object.create expects property descriptors.

Option B correctly uses a property descriptor with a function value and sets enumerable true. Option B misses enumerable, A adds method after creation, D uses wrong descriptor syntax.

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