ObjectinstanceofFunction or FunctioninstanceofObject is true or false. One by one, today's JavaScript is no longer a fancy script that was previously used as a toy to run on a webpage. JavaScript has been gradually standardized and is widely used in Web development as a real programming language. As a result, more and more people begin to re-understand the scripting language and are constantly exploring JavaScript core ideas and implementation principles. Some very confusing problems have been encountered during the process. This article focuses on a common but very confusing question for developers or beginners of JavaScript, that is, what is the relationship between the two core constructor objects and functions? Why do the returned results of the instanceof operator confuse you? This article will show you one by one. However, before that, we need to understand some concepts and basic running mechanisms in JavaScript.
Object architecture of JavaScript
In fact, in JavaScript, the entire core architecture is built around two constructor objects and functions. I will reference A JavaScript Object architecture diagram from mollypages.org.
Instanceof Operator
Instanceof is A binary operator, such as A instanceof B. A must be A legal JavaScript Object, and B must be A legal JavaScript function. The judgment process is as follows:
If function B is found in prototype chain of object A, the instanceof operator returns true; otherwise, false.
For example, the following code returns true.
// Return true if specified function is found // in the object's prototype chain as a constructor. alert ({} instanceof Object );
Prototype chain mechanism in JavaScript
Here is a brief summary, because this topic requires a lot of space to be discussed. This article only references this concept and focuses not on this mechanism in detail.
Prototype in JavaScript is closely linked to a function, because each function has a property named prototype by default, every object generated through the function and the new operator has an attribute _ proto __, which stores references to the prototype attribute of the constructor that creates it. The _ proto _ object is the core object that implements the prototype chain. JavaScript is an object-oriented programming language. Its Inheritance feature is actually implemented through the prototype chain mechanism. At the same time, the instanceof operator also needs to be supported in the prototype chain. Examples:
Code
The Code is as follows:
// Create a custom constructor Foo
Function Foo (){
}
// Create an insatnce of Foo
Var foo = new Foo ();
// Foo is an instance of Foo
Alert (foo instanceof Foo); // true
// Foo is also an instance of Object because
// Foo. prototype is an instance of Object.
// The interpreter will find the constructor
// Through the prototype chain.
Alert (foo instanceof Object); // true
// Prototype chain of the object foo
//
// _ Proto __
// Foo -----------> Foo. prototype -----------> Object. prototype -----------> null
// But foo is not an instance of Function, because
// We cocould not find Function. prototype in foo's
// Prototype chain.
Alert (foo instanceof Function); // false
// However, its constructor Foo is an instance
// Function.
Alert (Foo instanceof Function); // true
// It's also an instance of Object
Alert (Foo instanceof Object); // true
// Prototype chain of the constructor Foo
//
// _ Proto __
// Foo -----------> Function. prototype -----------> Object. prototype -----------> null
From the code above, we can draw a conclusion that the prototype chain of any Object can be traced back to the Object. prototype. this is why all objects in JavaScript inherit from objects.
Why do both the Object instanceof Function and Function instanceof Object return true?
Objects, functions, arrays, and so on are called constructors. They are all functions. All functions are instances of the constructor Function. From the perspective of the prototype chain mechanism, that is to say, all functions can find the construction prototype Function. protorype object for creating their Function constructor through the prototype chain, so:
Alert (Object instanceof Function); // return true
At the same time, because Function. prototype is an Object, so its constructor is an Object. from the perspective of the prototype chain mechanism, that is to say, all functions can use the prototype chain to find the prototype Object to create their Object constructor. prototype object, so:
Alert (Function instanceof Object); // return true
Interestingly, based on our analysis of instanceof through the prototype chain mechanism, we can easily conclude that the Function instanceof Function still returns true, and the principle is the same.
1. Function is a constructor, so it is a Function object.
2. Function objects are created by Function constructors. The prototype chain mechanism is interpreted as: Function. prototype exists in the prototype chain of Function objects.
3. instanceof searches for each node in the prototype chain. If the prototype of Function constructor Function is found in the prototype chain, true is returned.
Therefore, the following code returns true.
Alert (Function instanceof Function); // still true
Conclusion
1. In JavaScript, everything is an Object. They all inherit from the Object. Or the root node of the prototype chain of all objects is Object. prototype.
2. It is very important to understand how the prototype chain mechanism works in JavaScript. No matter how complex an object is, you can easily break it down.
