JavaScript Prototyping Learning Notes

1, "Everything is the object" the focus of this sentence is how to understand the concept of "object".

--Of course, not all of them are objects, and value types are not objects.

A function is also an object. He is also a collection of attributes, and you can also customize the properties for the function.

2, each function one property--prototype. Yes, each function has a property called prototype.

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. The property values (methods) of the constructor attribute are more common:hasOwnProperty()，isPrototypeOf()等等

(嘿嘿，这里就先暂时举例这些，Other: Https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype)

Each object has a hidden property--"__proto__", which references the prototype of the function that created the object. namely: fn.__proto__ = = = Fn.prototype;

(Each functional function has a prototype, which is a prototype.) Add one more sentence here-each object has a __proto__ that can become an implicit prototype. ）；

The prototype property of each function, which is a pointer to an object that is used to share all instance properties and methods of a particular type;

functionTest () {Test.prototype.name= "Spezz07"; Test.prototype.age=23; Test.prototype.message=function() {alert ( This. Name); }        }    vartest1=NewTest (); Test1.message ();//spezz07    varTest2=NewTest (); Console.log (test2.age)// atConsole.log (Test1.age===test2.age)//true

The properties and methods of the new object are shared;

We can access the values in the prototype through an object instance, but we cannot overwrite the values in the prototype through an object instance, and if we add a property to the instance with the same name as one of the properties in the prototype, we create the property in that instance, and that property in the prototype is masked.

functionTest () {Test.prototype.name= "Spezz07"; Test.prototype.age=23; Test.prototype.message=function() {alert ( This. Name); }        }    vartest1=NewTest (); Test1.age=24; Console.log (test1.age)//24来 Self-instance    varTest2=NewTest (); Console.log (test2.age)//23来 self-prototyping

In Test1, the attribute of age is found in the instance, so it returns without having to go up to the top (chain related), and test2, which is not found in the instance, then looks up to the upper level.

Of course, this instance property will only prevent us from accessing the "that attribute" of the prototype, but will not modify the "that attribute" in the prototype, but if we use the delete operator, we can completely delete the attribute in the instance, so that we can revisit the "that attribute" in the prototype;

   functionTest () {Test.prototype.name= "Spezz07"; Test.prototype.age=23; Test.prototype.message=function() {alert ( This. Name); }        }        vartest1=NewTest (); Test1.age=24; Console.log (test1.age)//24来 Self-instance        varTest2=NewTest (); Console.log (test2.age)//23来 self-prototyping;        DeleteTest1.age; Console.log (test1.age)//23来 self-prototyping

3, JS in the inheritance

The inheritance in JavaScript is manifested through the prototype chain. Look at some code first.

function Foo () {};     var f1=New  Foo ();    f1.a=10;    Foo.prototype.a=100;    foo.prototype.b=200;    Console.log (f1.a)//ten;    Console.log (f1.b)//

The above code, F1 is the Foo function new out of the object, f1.a is the F1 object's basic properties, f1.b is how to come? --from Foo.prototype, because f1.__proto__ is pointing to Foo.prototype.

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.

So how do we differentiate whether a property is basic or is found in a prototype in practical applications? Everyone probably knows the answer--hasownproperty, especially in for...in ... Cycle, be sure to pay attention.

Note: Where does this hasownproperty method of F1 come from? F1 itself, not in the Foo.prototype, where did it come from?

It is from the Object.prototype, please look at the picture:

The prototype chain of an object is walking along the __proto__ line, so when looking for the F1.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".

Note: The __proto__ default also has a pointing. It points to the highest object.prototype, while Object.prototype's __proto__ is empty. (Object.prototype__proto__===null)

JavaScript Prototyping Learning Notes