Prototype prototype in JavaScript

The prototype attribute can be considered a big difference between JavaScript and other object-oriented languages.

In short, prototype is "a method of adding methods to objects of a class," and using the prototype property, you can dynamically add properties and methods to the class to achieve the effect of "inheritance" in JavaScript .

The object that is constructed with this function as a constructor automatically has the member properties and methods of the prototype object that owns the constructor.

Among the key points are:

1. Prototype is a required property of a function (the written point is "reserved attribute") (as long as it is functions, there must be a prototype attribute)
2. The value of prototype is an object
3. You can modify the value of the prototype property of a function arbitrarily.
4. An object automatically owns the prototype member properties and methods of the constructor for this object.

To create an object:

For object objects, you can use 对象字面量(Object literal) them to create, for example:

var foo = {    ten    };

Each object in JavaScript implicitly contains a [[prototype]] property, which is the notation in ECMAScript, which is the notation used by major browser vendors to implement their own JavaScript interpreters, __proto__ meaning that each object implicitly contains a __proto__ Property.

When there are multiple objects, __proto__ a prototype chain can be formed through attributes. Look at the following example:

varA ={x:10, calculate:function(z) {return  This. x + This. Y +Z; }};varb ={y:20, __proto__: a};varc ={y:30, __proto__: a};//Call the inherited methodB.calculate (30);// -C.calculate (40);// the

The above code, when declaring objects B and C, indicated that they were prototyped as object A (the prototype of a is pointing to Object.prototye,object.prototype by default, the prototype of this object points to null), and the structure of these objects in memory is roughly the same:

In addition to the attributes we say here __proto__ , it is generally more common to believe that you are prototype attributes.

<! DOCTYPE html>/*every object in JavaScript has a __proto__ property, but only the function object has the prototype property. The __proto__ property of an object created with object literals points to Object.prototype (the __proto__ property of Object.prototype points to null); The __proto__ of objects created with function literals    The Function.prototype property points to the __proto__ property of the Function.prototype object, pointing to Object.prototype. */    //The implicit prototypes of B and C (__proto__) point to the implicit archetype of a (__proto__). a.__proto__ ==>object.prototype    /*b.__proto__ ==> a.__proto__ () c.__proto__ ==> a.__proto__ () a.__proto__ ==>object.prototype > object.prototype.__proto__ ==> NULL*/    varA={x:10, calculate:function(z) {return  This. x+ This. y+Z; }    }    varb={y:20, __proto__:a}varC={y:30, __proto__:a} console.log (B.calculate (30)) Console.log (C.calculate (40)) Console.log (b.__proto__= = a)//trueConsole.log (c.__proto__== a)//trueConsole.log (b.__proto__== c.__proto__)//true    /*1 __proto__ represents the prototype of the Function Object 2 prototype represents the prototype of the newly created object when using new to execute the function (this function generally becomes the constructor). */Array.prototype.sum=function(){        varResult=0;  for(vari=1;i<= This. length;i++) {result+=i; }        returnresult; } Array.prototype.clear=function(){    }    vararr=[1,2,3,4,5]; Console.log (Arr.sum ()) Console.log (arr.__proto__==array.prototype)//true    varArr2=NewArray (2,4,6); Console.log (arr2.__proto__==array)//falseConsole.log (Arr2.__proto__==array.prototype)//true</script>
<! DOCTYPE html>functionFoo (y) { This. y =y; } foo.prototype.x= 10; Foo.prototype.calculate=function(z) {return  This. x + This. Y +Z;    }; varb =NewFoo (20); varc =NewFoo (30); B.calculate (30);// -C.calculate (40);// theConsole.log (b.__proto__= = = Foo,//falseb.__proto__ = = = Foo.prototype,//truec.__proto__ = = = Foo.prototype,//trueB.constructor= = = Foo,//trueC.constructor = = = Foo,//trueFoo.prototype.constructor = = = Foo,//trueb.calculate= = = B.__proto__.calculate,//trueB.__proto__.calculate = = = Foo.prototype.calculate//true    );</script>
Every object in JavaScript has __proto__ properties, but only 函数对象 prototype attributes.
So what is the difference between these two properties in a function object?

 
  

  
   
 
    
__proto__Represents the prototype of the function object
 
    
prototypeRepresents the prototype of the newly created object when using new to execute the function, which typically becomes a constructor.
 
   
 
  
Prototype prototype in JavaScript