Today's JavaScript is no longer a fancy script that has been used as a toy to run on a Web page. JavaScript has become more standardized and widely used as a real programming language for Web development. As a result, more and more people are beginning to recognize the scripting language, and in the ongoing exploration of JavaScript core ideas and implementation principles, the process encountered some very confusing problems. This article focuses on an issue that is more common but very easy to confuse developers or beginner JavaScript, that is, what is the relationship between two core constructors object and function? Why is the return result of the instanceof operator confusing to you? This article will be for you in one by one ways. Before we do that, however, we need to understand some of the concepts and basic operating mechanisms in JavaScript.
The object architecture of JavaScript
In the JavaScript language, the entire core architecture is built around the two constructors object and function. I'll refer to a JavaScript Object architecture diagram from mollypages.org to illustrate.
instanceof operator
Instanceof is a two-dollar operator, such as: a instanceof B. Where, a must be a legitimate JavaScript object, B must be a legitimate JavaScript function (function). The process of judgment is as follows:
If function B is found in the prototype chain of object A (prototype chain), then the instanceof operator returns true, otherwise it returns false.
For example, the following code returns TRUE.
Return TRUE if specified function was found//in the object ' s prototype chain as a Constructor.alert ({} instanceof Objec T);
The prototype chain (prototype chain) mechanism in JavaScript
Here is a brief summary, because this topic needs a lot of space to discuss, this article only cited this concept, the focus is not to discuss the mechanism in detail.
The prototypes in JavaScript (prototype) are closely connected to functions, because each function defaults to a property called prototype, and each object generated by the function and the new operator has a property __proto__. This property holds a reference to the prototype property of the constructor that created it. This __proto__ object is the core object of realizing the prototype chain. JavaScript is an object-oriented programming language, its inheritance characteristic is actually through the prototype chain mechanism to realize. At the same time, the instanceof operator also needs support in the prototype chain. We illustrate the following examples:
Code
Copy Code code 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'll find the constructor
Through the prototype chain.
Alert (foo instanceof Object);/True
Prototype chain of the object foo
//
__proto__ __proto__ __proto__
Foo-----------> Foo.prototype-----------> Object.prototype-----------> Null
But Foo is not a instance of Function, because
We could not find Function.prototype in Foo ' s
Prototype chain.
Alert (foo instanceof Function);//False
However, its constructor Foo was an instance of
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__ __proto__ __proto__
Foo-----------> Function.prototype-----------> Object.prototype-----------> Null
From the above code to analyze, we are not difficult to conclude that any object of the prototype chain can be traced back to Object.prototype. That's why we say that all objects in JavaScript are inherited from object.
Why does the object instanceof function and function instanceof object return true?
Object, function, array, and so on are all called constructs "functions", they are all functions. All functions are instances of constructor functions. From the perspective of the prototype chain mechanism, it means that all functions can find the constructed prototype Function.protorype object that creates their function constructors through the prototype chain, so:
Alert (Object instanceof Function);//return True
At the same time, because Function.prototype is an object, so is his constructor. From the perspective of the prototype chain mechanism, it means that all functions can find the constructed prototype Object.prototype object that created their object constructor through the prototype chain, so:
Alert (Function instanceof Object);//return True
Interestingly, based on our analysis of instanceof through the prototype chain mechanism, it is not difficult to conclude that the function instanceof function still returns true, and the principle is the same.
1. The function is a constructor, so it is a functional object
2. Function objects are created by function constructors, and the prototype chain mechanism is interpreted as follows: Existence of Function.prototype in the prototype chain of function objects
3. instanceof looks for each node in the prototype chain and returns True if the Function.prototype of the constructor function is found in the prototype chain
So the following code still returns true
Alert (function instanceof function);//Still True
Conclusion
1. In the JavaScript language, everything is an object, and they all inherit from object. or the root node of the prototype chain of all objects is object.prototype.
2. It is important to understand how the prototype chain works in JavaScript Chinese. Master it, no matter how complicated an object is, you can always easily break it.
