Example: Basic knowledge of instance object and prototype object in JavaScript

This article mainly introduces the Instance Object and prototype object in JavaScript. For the constructor attribute and prototype attribute, you can refer to the following statement for a friend who needs it: each object in javascript has a constructor attribute and a prototype attribute. Constructor points to the object's constructor, and prototype points to the prototype object of the object instance created using the constructor.

function Person(){    } var person = new Person();  Person.prototype = {  constructor : Person,  name : 'zxs',  age : 24,  sayName : function(){alert(this.name)}  }   person.sayName(); 

In this Code, the following error occurs: sayName () is not defined. According to the interpretation of the second version of javascript advanced programming, the rewriting prototype breaks the connection between the constructor and the original prototype. However, Let's adjust the order of the above statements. As follows:

Function Person () {}// var person = new Person (); Person. prototype = {constructor: Person, name: 'zxs ', age: 24, sayName: function () {alert (this. name )}} /* ===================================================== ===================================== */var person = new Person (); /* ===================================================== ===================================== */person. sayName (); // zxs alert (person. constructor) // function Object () {[native code]} or function Person () {} depends on whether the blue statement is valid

Pay attention to the statements in the middle of the equal signs of the above two codes. Writing the code in the second step will output "zxs". This result indicates that in the first case, an error is not returned because the constructor is disconnected from the original idea.

Person.prototype = ｛｝ 

This is a method for defining objects, and the constructor attribute of each Object in javascript points to the Object constructor by default, it is not difficult to explain that the re-built prototype object does cut off the relationship between the constructor and the original prototype, but it does not indicate that after this relationship is cut off, the person cannot access the sayName () function.

The assumption is that the prototype attribute of the function points to a prototype object, which is not exactly the same as the new prototype object. When we call a function, we will create a prototype object. At this time, we will first find whether the prototype object exists in the current environment. If the program does not exist, we will create one. If the environment exists, side to find their properties and methods, and finally return a prototype object based on the search results. The attributes and methods in this object always give priority to the attributes and methods in the default prototype, that is, the attributes and methods defined in the constructor. When the called method or attribute does not exist in the default prototype, the attributes and methods defined in Person. prototype = {} are used.

Javascript is an explanatory language and statements are executed sequentially. In the first code, when we use the new keyword to create a new object, Person. prototype = {} is not executed. That is to say, the defined methods and attributes cannot be found in the current execution environment, but the constructor does not. Therefore, an error occurs. Like a variable, the program cannot be used when it is not executed. The called method already exists in the stage in section 2, and the prototype object of the constructor has been created, so you can get the result.

Let's look at the following program:

//////////////////////////////////////////////////////////////////////////  function Person(){}  /*===========================================================*/   var person = new Person(); Person.prototype.name = 'song';  /*===========================================================*/  //Person.prototype.sayName = function(){alert(this.name)}; Person.prototype = { constructor : Person, name : 'zxs', age : 24, sayName : function(){alert(this.name)} } person.sayName(); // error  //////////////////////////////////////////////////////////////////////////  function Person(){  } /*var person = new Person();*/ Person.prototype.name = 'song';  /*Person.prototype.sayName = function(){alert(this.name)};*/ Person.prototype = {   constructor : Person,   name : 'zxs',   age : 24,   sayName : function(){alert(this.name)} }  /*===========================================================*/ var person = new Person();  /*===========================================================*/ person.sayName(); // zxs 

From this we can see that using Person. prototype. name = ''. The object can be accessed no matter where it is created. If the object literal volume and the method define the prototype object exist at the same time, the post-defined object will be used as the final value. After the prototype object is defined using the object literal, the definition must appear before the object creation statement can be accessed.

The instance cannot access the attributes and methods in the prototype object, not only because the prototype object is rewritten to cut off the relationship between the constructor and the original prototype.

function Person(){        }  var person = new Person();    Person.prototype = {    //constructor : Person,    name : 'zxs',    age : 24,    sayName : function(){alert(this.name)}    }      person.sayName();  

The prototype of the constructor is empty when the above Code instantiates an object. It does not have any attributes other than the default attributes. The prototype of the rewrite constructor does cut off the relationship between the constructor and the original prototype.

Attributes and methods in the prototype object of the constructor after the new operator are added to the person object. Because the method above adds new attributes and methods for the function prototype is not dynamic, the person cannot access the newly added attributes and methods.

After rewriting the prototype object, it is like the following code:

var o = {   name : 'zxs'   }    var obj = o; o = {} console.log(o.name);  

The output value is undefined, because the object is a reference type, "=" is a value assignment operator, and its operation order is from right to left. O ={} indicates that the direction of o has changed and is an empty object.
Person. prototype. mothed = function () {} and Person. prototype = {mothed: function () {} is similar to arr = [] and arr. like push (), the former changes itself, and the latter completely changes itself.