Prototype inheritance in Javascript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

Output of prototype property access

What is the output of the following code?

Javascript

function Person(name) {
  this.name = name;
}
Person.prototype.greet = function() {
  return `Hello, ${this.name}`;
};
const alice = new Person('Alice');
console.log(alice.greet());

A TypeError: alice.greet is not a function

B undefined

C "Hello, Alice"

D "Hello, undefined"

💡 Hint

Remember that methods defined on the prototype are accessible to instances.

The greet method is defined on Person.prototype, so alice inherits it and can call it. The name property is set to 'Alice', so the output is "Hello, Alice".

❓ Predict Output

intermediate

Effect of changing prototype after instance creation

What will be the output of this code?

Javascript

function Animal() {}
Animal.prototype.sound = function() { return 'generic sound'; };
const dog = new Animal();
Animal.prototype = {
  sound: function() { return 'bark'; }
};
console.log(dog.sound());

A "bark"

B "generic sound"

C TypeError: dog.sound is not a function

D undefined

💡 Hint

Think about when the prototype is linked to the instance.

The dog instance keeps the original prototype linked at creation. Changing Animal.prototype later does not affect existing instances. So dog.sound() calls the original method returning "generic sound".

🔧 Debug

advanced

Why does this prototype chain fail?

The following code tries to create a prototype chain where Student inherits from Person. Why does calling student.introduce() cause an error?

Javascript

function Person(name) {
  this.name = name;
}
Person.prototype.introduce = function() {
  return `Hi, I'm ${this.name}`;
};

function Student(name, subject) {
  Person.call(this, name);
  this.subject = subject;
}
Student.prototype = Person;
Student.prototype.constructor = Student;

const student = new Student('Bob', 'Math');
console.log(student.introduce());

A undefined

B "Hi, I'm Bob"

C ReferenceError: introduce is not defined

D TypeError: student.introduce is not a function

💡 Hint

Check how the prototype is assigned for Student.

Assigning Student.prototype = Person assigns the function Person itself, not its prototype object. So student.__proto__ is a function, which does not have introduce method. The correct way is Student.prototype = Object.create(Person.prototype).

🧠 Conceptual

advanced

Prototype chain property lookup order

Given the following objects, which property value will be logged?

Javascript

const grandparent = { trait: 'wisdom' };
const parent = Object.create(grandparent);
parent.trait = 'strength';
const child = Object.create(parent);
console.log(child.trait);

A "strength"

B "wisdom"

C undefined

D TypeError

💡 Hint

Remember how property lookup works in prototype chains.

child does not have trait, so it looks up to parent which has trait = 'strength'. It returns that value without checking grandparent.

❓ Predict Output

expert

Output of modifying prototype after instance creation with method override

What is the output of this code?

Javascript

function Vehicle() {}
Vehicle.prototype.move = function() { return 'moving'; };
const car = new Vehicle();
Vehicle.prototype.move = function() { return 'driving'; };
console.log(car.move());

A "driving"

B undefined

C TypeError: car.move is not a function

D "moving"

💡 Hint

Think about how methods on the prototype are looked up at call time.

car.move looks up the move method on Vehicle.prototype at call time. Since the method was replaced after car was created, car.move calls the new method returning "driving".