isPrototypeOf Function in JavaScript

Sometimes when you look at some framework source code, you will encounter isPrototypeOf() function. So what does this function do?

1. isPrototypeOf()

isPrototypeOf() is a method under the Object function (class) that is used to determine whether the current object is the prototype of another object. If so, it returns true , otherwise it returns false .

The key to understanding this function is on the prototype chain, which is said to be one of the three major mountains of JavaScript .

The principles are not described in detail here, but simply put, there are three points:

• 1. Function objects are born with a prototype property.
• 2. Every object is also born with a property __proto__ pointing to prototype of the function object that generates it.
• 3. prototype of a function object also has __proto__ pointing to prototype of the function object that generated it.

Example 1, Object class instance:

let o = new Object();
console.log(Object.prototype.isPrototypeOf(o)); // true

Because the o object is an instance of Object , the prototype （__proto__） of the o object points to the prototype ( prototype ) of Object , and true will be output above.

Example 2: Define the Human class yourself:

function Human() {}
let human = new Human();
 
console.log(Human.prototype.isPrototypeOf(human)); // true

This example is similar to the previous one. Because the human object is an instance of Human , the prototype of the human object （__proto__） points to the prototype of Human ( prototype ), and the above will output true .

Example 3: Let’s see if Object’s prototype is the prototype of human:

console.log(Object.prototype.isPrototypeOf(human)); // true

Why? , which may be better explained with code, please see the following derivation:

// Because the prototype (__proto__) in Human's prototype (prototype) points to Object's prototype (prototype)
Human.prototype.__proto__ === Object.prototype
// And because the prototype of human (__proto__) points to the prototype of Human (prototype)
huamn.__proto__ === Human.prototype
// So the prototype of the human object (__proto__) points to the prototype of Object (prototype)
huamn.__proto__.__proto__ === Object.prototype

This is easy to understand if you look at the structure of human:

So is Object 's prototype the prototype of the human object? To be precise, Object 's prototype is on the human 's prototype chain.

Example 4, whether Object.prototype is the prototype of a built-in class:

The built-in classes Number , String , Boolean , Function , Array in JavaScript all inherit Object , so the following outputs are all true :

console.log(Object.prototype.isPrototypeOf(Number)); // true
console.log(Object.prototype.isPrototypeOf(String)); // true
console.log(Object.prototype.isPrototypeOf(Boolean)); // true
console.log(Object.prototype.isPrototypeOf(Array)); // true
console.log(Object.prototype.isPrototypeOf(Function)); // true

Naturally, Object.prototype is also the prototype of instances of Number , String , Boolean , Function , and Array .

Example 5, Object is also a function (class):

It is also worth mentioning that Function.prototype is also the prototype of Object , because Object is also a function (class), they generate each other.

Please see the following output:

console.log(Object.prototype.isPrototypeOf(Function)); // true
console.log(Function.prototype.isPrototypeOf(Object)); // true

2. Difference from instanceof

instanceof is used to determine whether an object is an instance of an object.

For example:

function Human() {}
let human = new Human();
 
// human is an instance of Human, so the output is true
console.log(human instanceof Human); // true
 
// Because all classes inherit Object, the result also outputs true
console.log(human instanceof Object); // true
 
// Because the human object is not an array, the result output is false
console.log(human instanceof Array); // false

Here are some more examples of built-in classes:

// [1,2,3] is an instance of Array, so the output is true
console.log([1, 2, 3] instanceof Array); // true
 
// The method function(){} is an instance of Function, so it outputs true
console.log(function(){} instanceof Function);

The principle of instanceof is to determine whether the prototype object (prototype) of the class can be found in the prototype chain of the instance, while isPrototypeOf determines whether the prototype object ( prototype ) of the class is on the prototype chain of the instance.

So my understanding is that the meaning of these two expressions is the same, but they are written differently. The following two outputs should be the same:

console.log(A instanceof B);
console.log(B.prototype.isPrototypeOf(A));

summary

In fact, to understand the isPrototypeOf function, the key is to understand the prototype chain.

This is the end of this article about the isPrototypeOf function in JavaScript . For more information about isPrototypeOf in JavaScript, please search previous articles on 123WORDPRESS.COM or continue to browse the following related articles. I hope you will support 123WORDPRESS.COM in the future!