"JavaScript" JavaScript prototypes and Inheritance

Everything is an Object!

The following four types (undefined, number, String, Boolean) belong to a simple value type, not an object. The remaining cases--functions, arrays, objects, NULL, new number (10) are all objects. They are all reference types.

It is very simple to judge whether a variable is not an object. The type of the value type is judged with typeof, and the type of the reference type is judged with instanceof.

var fn = function () {};console.log (fn instanceof Object);  True

The object in Java is a new class, and there are fields, properties, methods, strict rules. But JavaScript is more casual, an array is an object, a function is an object, an object, or an object. Everything inside the object is a property, only attributes, no method. So how does this approach show? Method is also a property. Because its properties are represented in the form of a key-value pair. And the objects in JavaScript can be arbitrarily extended properties, without class constraints.

　　In JavaScript, everything (reference type) is an object, and the object is a collection of properties.

All objects are created through a function!

Such as:

var obj = {a:1, b:2}, var mm = {, ' X ', false}

Essentially, the essence is:

var obj = new Object ();　　OBJ.A = 1;　　OBJ.B = 2;var mm = new Array ();　　Mm[0] = 12;　　MM[1] = X; MM[2] = false;

Both the object and array are functions.

The above wording is actually a "convenient way" to write the following.

prototype prototype

　! 　 each function has a default property of "prototype".

As I said earlier, each function is an object and is a collection of properties that you can customize for a function. Javascrpit defaults to a default property---prototype for each function.

The attribute value of this prototype is an object (a collection of attributes), and the default is only a property called constructor, which points to the function itself.

　　

Of course, prototype as an object, a collection of properties can also be customized to add many properties.

function Fn () {}fn.prototype.name = ' Tom '; Fn.prototype.getYear = function () {       return 1988;};

Implicit prototype _proto_

　 ! 　 Each object has a hidden property "_proto_", which references the prototype of the function that created the object. That is: fn.__proto__ = = = Fn.prototype.

The "__proto__" here is called "implicit prototyping".

　　

As you can see in the above diagram, the custom function foo.__proto__ points to function.prototype,object.__proto__ to Function.prototype. function is also a function, which is an object and has a __proto__ property. Since it is a function, it must be created by functions. So--function is created by itself. So its __proto__ points to its own prototype.

Each object has a __proto__ property that points to the prototype of the function that created the object. And the prototype of each function is also an object, he also has a _proto_ property, which is essentially the same as var obj = {}, is created by object, so its __proto__ points to object.prototype.

The _protype property of Object.prototype is special and it points to a null value.

TypeOf & Instanceof

For value types, you can judge by TypeOf, String/number/boolean is clear, but typeof when judging the reference type, the return value is only object/function, you do not know whether it is an object, or an array , or new number and so on, this time you need to use the instanceof.

　　

The first variable of the instanceof operator is an object, temporarily called A; the second variable is generally a function, temporarily called B.

Instanceof's judgment team is to find the line along the __proto__ of a, and to find it along the line of the B's prototype, if two lines can find the same reference, that is, the same object, then return True. Returns False if the end of the find is not coincident.

Like what:

Console.log (object instanceof function), Console.log (function instanceof object), Console.log (function instanceof Function);

The result is true.

And how to understand the role of instanceof?

In fact, instanceof represents an inheritance relationship, or the structure of a prototype chain.

Inheritance & prototype chain

"Inheritance" is the most basic concept in the common object-oriented language, but inheritance in Java is completely different from JavaScript.

The inheritance in JavaScript is manifested through the prototype chain.

As in the following code:

function Foo () {};var f = new Foo ();
F.name = ' Cat '; Foo.prototype.name = ' Tom '; Foo.prototype.sex = ' man ' Console.log (f.name); Console.log (F.sex);

Results:

To access the properties of an object, look in the basic properties first, if not, and then look up along the __proto__ chain, which is the prototype chain.

In the previous example, when accessing F.sex, there was no sex in the basic properties of F, and Foo.prototype.sex was found along the __proto__.

How do we differentiate whether a property is basic or is found in a prototype in practical applications? The answer is--hasownproperty. For example: if (F.hasownproperty (X)) {}.

And the problem comes out, there is no hasownproperty this method in F, then where does this method come from?

In fact, he got it from the Object.prototype. The prototype chain of an object is walking along the __proto__ line, so when looking for the F.hasownproperty attribute, it is always looking for object.prototype along the prototype chain.

Because all of the object's prototype chains will find Object.prototype, all objects will have a Object.prototype method. This is known as "inheritance".

Ps:

If the inherited method doesn't feel right, you can modify it yourself.

You can also add a method yourself if the inheritance does not meet your needs. However, if you want to add the prototype property of the built-in method, it is best to make a decision if the property does not exist and add it. If it exists, there is no need to add it.

"JavaScript" JavaScript prototypes and Inheritance