isPrototypeOf Function in JavaScript

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!

You may also be interested in:
  • Javascript Prototype
  • JavaScript Prototype Details
  • A thorough understanding of js native syntax prototype, __proto__ and constructor
  • JavaScript uses the prototype property to implement inheritance operations example
  • Implementation of JS array dimensionality reduction Array.prototype.concat.apply([], arr)
  • Extension of js String.prototype.trim character to remove leading and trailing spaces
  • JavaScript __proto__ and prototype

<<:  TinyEditor is a simple and easy-to-use HTML WYSIWYG editor

>>:  A brief summary of basic web page performance optimization rules

Recommend

js implements form validation function

This article example shares the specific code of ...

Detailed explanation of how to easily switch CSS themes

I recently added a very simple color scheme (them...

Full steps to create a password generator using Node.js

Table of contents 1. Preparation 2. Writing comma...

Complete step record of Vue encapsulation of general table components

Table of contents Preface Why do we need to encap...

Theory Popularization——User Experience

1. Concept Analysis 1: UE User Experience <br ...

MySQL uses limit to implement paging example method

1. Basic implementation of limit In general, the ...

How to build your own Nexus private server in Linux

This article describes how to build a Nexus priva...

Implementation of socket options in Linux network programming

Socket option function Function: Methods used to ...

MySql login password forgotten and password forgotten solution

Method 1: MySQL provides a command line parameter...

A brief discussion on the font settings in web pages

Setting the font for the entire site has always b...

Sharing some details about MySQL indexes

A few days ago, a colleague asked me a question a...

Solution to Linux CentOS 6.5 ifconfig cannot query IP

Recently, some friends said that after installing...