Prototype Methods

Prototypes / Inheritance: Prototype Methods

---

Is there a way to implement prototypal inheritance without calling proto accessor property (deprecated) in JavaScript?

View Answer:

Interview Response: Since, the proto property is deprecated based the JavaScript specification. There are three modern methods that can be used in prototypal inheritance including Object.create(obj), Object.getPrototypeOf(obj), and Object.setPrototypeOf(obj, proto).

The Object.create(obj) method is used to create an empty object with given proto as prototype and optional property descriptors. The Object.getPrototypeOf(obj) that returns the prototype of an object, and Object. Object.setPrototypeOf(obj, proto) which sets the prototype of obj to proto.

Code Example:

let animal = {
  eats: true,
};

// create a new object with animal as a prototype
let rabbit = Object.create(animal);

console.log(rabbit.eats); // true

console.log(Object.getPrototypeOf(rabbit) === animal); // true

Object.setPrototypeOf(rabbit, {}); // change the prototype of rabbit to {}

console.log(Object.getPrototypeOf(rabbit) === animal); // false

---

Can you explain the function and syntax of the Object.create(obj) method in JavaScript?

View Answer:

Interview Response: The Object.create() method creates a empty object, using an existing object as the prototype of the newly created object. It has two parameters, including the proto and the descriptors. The proto parameter is the object which should be the prototype of the newly created object. The descriptors get defined as an object whose enumerable properties specify property descriptors that get added to the newly created object.

Technical Response: The "Object.create()" function generates a new object by utilizing an existing object as the prototype. It contains two parameters: the prototype and the descriptors (propertiesObject in the specification). The proto parameter specifies the object that will serve as the prototype for the newly formed object. The descriptors (propertiesObject) are defined as an object whose enumerable own properties (those defined upon itself and not enumerable properties along its prototype chain) specify property descriptors to be added to the newly created object, along with the corresponding property names, if specified and not undefined. These are the properties defined by the second parameter to Object.defineProperties(). Descriptors function similarly to property flags.

Code Example:

Syntax: Object.create(proto, [descriptors]);

let animal = {
  eats: true,
};

let rabbit = Object.create(animal, {
  jumps: {
    value: true,
  },
});

alert(rabbit.jumps); // true

---

What is the function and syntax of the Object.getPrototypeOf() method in JavaScript?

View Answer:

Interview Response: The Object.getPrototypeOf(obj) method returns the prototype of the specified object. If there are no inherited properties, null gets returned.

Code Example:

Syntax: Object.getPrototypeOf(obj);

const prototype1 = {};
const object1 = Object.create(prototype1);

console.log(Object.getPrototypeOf(object1) === prototype1);
// expected output: true

---

What is the function and syntax of the Object.setPrototypeOf(obj, proto) method in JavaScript?

View Answer:

Interview Response: The Object.setPrototypeOf() method sets the prototype of a specified object to another object or null.

Syntax: Object.setPrototypeOf(obj, proto);

warning

According to the MDN, its advised to use Object.create(obj) instead of this method.

---

Can you change [[Prototype]] on existing objects, in JavaScript?

View Answer:

Interview Response: Yes, however it is seen as a horrible idea. We have the ability to get/set [[Prototype]] at any moment. However, it is normally only set once at the time of object creation, and the object is not modified after that.

Technical Response: Technically, yes, but it is thought to be a horrible idea. We have the ability to get/set [[Prototype]] at any moment. However, it is normally only set once at the moment of object creation and is not changed again. Using Object to make "on-the-fly" changes to a prototype. setPrototypeOf or obj. __proto__ = is a sluggish operation because it violates internal object property access optimizations. So, unless you know what you're doing or performance isn't important to you, we should avoid it.

warning

According to the MDN, changing the prototype after creation is a slow operation and can affect performance.

---

Why was __proto__ replaced by the functions getPrototypeOf / setPrototypeOf?

View Answer:

Interview Response: According to the MDN, the creators replaced it with getPrototypeOf and setPrototypeOf, because of the performance issues related to its use.

note

If you care about performance, you should avoid setting the [[Prototype]] of an object. Instead, create a new object with the desired [[Prototype]] using Object.create().

---

What do you prefer, class inheritance and prototypal inheritance in JavaScript? If so, why?

View Answer:

Interview Response: Instances inherit from classes when we use class inheritance, and Hierarchical class taxonomies get created due to this. In contrast, instances inherit from other objects through prototypal inheritance, and they get formed from several objects. Because it is more straightforward and more versatile, I favor prototypal inheritance.

---

When is classical inheritance an appropriate choice?

View Answer:

Interview Response: The answer is never or rarely. Indeed, never more than one level. Multi-level class hierarchies are an anti-pattern, and it can lead to problems like method collision, which is not good.

note

I've been posing this issue for years, and the only responses I've ever received fall into one of three prevalent assumptions. The challenge typically gets received with silence.

---

What is the difference between class inheritance and prototypal inheritance?

View Answer:

Interview Response: Classes inherit from classes created in sub-classes using a hierarchical class taxonomy. Prototypal inheritance equates to a prototype functioning as an object instance, and objects inherit directly from each other. The difference is that class taxonomy is not a derivative of prototypal inheritance.

Technical Response:

Class Inheritance: Instances inherit from classes (similar to a blueprint or a class description) and form sub-class relationships: hierarchical class taxonomies. We can use JavaScript to create instances using constructor functions that use the 'new' keyword. The ES6 'class' keyword may or may not be used for class inheritance.

Prototypal Inheritance: In JavaScript, Instances directly inherit from other objects. Instances often get created using factory methods or the 'Object.create()' method. Instances may be built up from various entities, allowing for simple selective inheritance.

---

What is a factory function?

View Answer:

Interview Response: Factory functions are similar to constructor functions/class functions, but instead of requiring new to create an object, factory functions simply create an object and return it. They are often used to create objects that are not classes. Factory functions also do not require the use of the 'this' keyword for inner values. A factory function is different from a regular function in that it always returns an object, with any method, value, etc. contained within it.

Code Example:

// Function creating new objects
// without use of 'new' keyword
function createCat(name) {
  return {
    name: name,
    talk: function () {
      console.log('My name is ' + name + ', the cat in the hat.');
    },
  };
}

//Create a cat with name Fuzzy
const cat1 = createCat('Fuzzy');

cat1.talk();

// Create a cat with name Fuzzy 2.O Upgraded
const cat2 = createCat('Fuzzy 2.O Upgraded');

cat2.talk();

---