The inheritance of objects in JS and the mystery of instantiation and shallow copy deep copy

Source: Internet
Author: User
Tags hasownproperty

Attribution Problem of attribute

The properties and methods defined in the JS object are not affected on the prototype chain if they are not methods and properties that are hung on the prototype chain (defined directly by means of an X-like approach) only on that object. Methods that are common to all instances can be defined directly on the prototype chain so that the attribute method is not defined for each instance, and all instances have a reference to that side, as shown in the final output.

functionMyclass () { This. x= "x in Myclass"; This. get=function(){}//each time the object is instantiated, the method for each object is independent and is not the same}myclass.prototype.y= "Y in Myclass"; Myclass.prototype.set=function(){};//all instances share this method and have the same instance for the methodvarobj=NewMyclass (); Console.log (OBJ.Y);//y in Myclassobj.y= "Override Y";//Find property Now on current object find, not found to find on prototype chainConsole.log (OBJ.Y);//Override yDeleteObj.y//trueConsole.log (OBJ.Y);//y in MyclassvarObj2=NewMyclass (); Console.log (OBJ2.Y);//y in Myclassobj.z= ' zzz '; Console.log (obj.z);//zzzConsole.log (obj2.z);//undefinedConsole.log (obj.prototype);//undefinedConsole.log (Obj.get===obj2.get)//false;Console.log (Obj.set===obj2.set)//true, all instances have the same reference

The difference between the __proto__ and prototype of the prototype in JS:

All instance objects have __proto__ to represent their prototypes, prototype is a property of the method, and the property of the non-object method is null, both of which are used to represent the prototype chain of an object. Because in many cases the former is a private property is generally not directly used so you can use Object.getprototypeof (obj) to get to the prototype object, Object.create () is the prototype of the creation of the object.

functionMyclass () { This. x= "x in Myclass"; This. get=function(){}//each time the object is instantiated, the method for each object is independent and is not the same}myclass.prototype.y= "Y in Myclass"; Myclass.prototype.set=function(){};//all instances share this method and have the same instance for the methodvarObj=object.create (NewMyclass ());//obj.__proto__.y=10;Console.log (obj.__proto__); Console.log (myclass.prototype);varObj2=NewMyclass (); Console.log (Myclass.prototype===OBJ.__PROTO__.__PROTO__);//tureConsole.log (obj.x); Console.log (object.getprototypeof (OBJ2)===myclass.prototype);//true

Iii. instantiation and inheritance of objects

Use new to instantiate objects, use prototypes (prototype) to implement inheritance, inherit only properties and methods on the prototype chain, and not inherit properties and methods that hang on the object itself, while instantiating objects with all properties and methods.

functionMyclass () { This. x= "x in Myclass";//each time the object is instantiated, the method for each object is independent and is not inherited This. get=function() {}}myclass.prototype.y= "Y in Myclass"; Myclass.prototype.set=function(){};//all instances share this method, with the same reference to the method, and the properties and methods defined on the prototype chain are inheritedvarObj=object.create (Myclass.prototype);//the first parameter of create must be a prototype, the second parameter is used to define the property and the Defineproperties/defineproperty is used the same wayConsole.log (obj.x);//undefinedConsole.log (OBJ.Y);//y in Myclass

Thus can be defined by the mixed mode of the object implementation of the property or part of the method of inheritance, do not want to be inherited by the use of constructors This.property way definition, want to be inherited directly defined on the prototype chain (such as the above only inherit the Y property and the Set method, the other X is not inherited). However, if the direct instantiation will have all the properties and methods. The Create method only has inherited properties and methods.

Inherited objects that use instantiated objects as prototypes do not affect the object instantiated by the original object

functionMyclass () { This. x= "x in Myclass"; This. get=function(){}//each time the object is instantiated, the method for each object is independent and is not the same}myclass.prototype.y= "Y in Myclass"; Myclass.prototype.set=function(){};//all instances share this method and have the same instance for the methodfunctionobj () {};obj.prototype=NewMyclass ();varobj1=Newobj ();//the object created by using Create is an instance that cannot be instantiated.obj1.x=12;varObj2=NewMyclass (); Console.log (obj2.x);//x in MyclassConsole.log (obj1.x);// A

1, JS can be directly using Delete to delete the properties of the object, but can not delete the prototype chain properties, and ordinary variables, and when the property in the object is configured to False can not delete the property

1, Object Properties Delete (delete cannot delete properties on prototype chain)

function Fun () {this. Name = ' mm ';} var New Fun (); Console.log (obj.name); // mm Delete  //undefined

2, variable deletion (in strict mode you cannot use Delete to delete a variable)

var name = ' Lily '; Delete  //Lily

No variables can be deleted directly with Delelte

3, can not delete the variables in the prototype chain

Fun.prototype.age =; Delete  //

Iv. shallow copy deep copy of Object

deep Copy, shallow copy: Shallow copy: Does not continue to parse the object inside the object to assign valuefunctiondeepcopy (P, c) {varc = C | | {};  for(varIinchp) {C[i]=P[i]; }returnC; } Deep copy:functiondeepcopy (P, c) {varc = C | | {};  for(varIinchp) {if(typeofP[i] = = = ' object ') {C[i]= (P[i].constructor = = = Array)? [] : {};      Deepcopy (P[i], c[i]); } Else{C[i]=P[i]; }}returnC; } 
Compare two objects that is equal if the object's reference is compared directly with = =, = = =, when the object's reference is the same. The way the appeal is copied is not equal to the object, only the assignment is equal. Therefore, it is important to judge whether the object is equal as long as the attribute name, number, and value are equal or are judged by the type reference.

V. Methods commonly used in objects

1, through Object.preventextention (a) can prohibit the extension of a object

2, using Object.seal () to seal the object is not configurable and re-assigned the value of the object

3, using Object.freeze () to freeze the object so that the object can only read

4, access to properties in the object if there is no definition will return undefined but access to a variable that is not defined will prompt uncaught Referenceerror

5. The method of determining whether an attribute exists in an object:

(1) ' A ' in myobject determine if the A attribute is in MyObject (the prototype chain will be searched)

(2) Myobject.hasownproperty (' a ') This only finds properties on the current object that exist but are not found on the prototype chain.

Both of these methods can be used to find non-enumerable properties

Non-enumerable properties are not allowed to be traversed.

6, Propertyisenumerale () is used to determine if a property is enumerable

7, Object.keys () to get the property names of all of their enumerable properties (not including inherited on the prototype chain)

8. The For In loop iterates through all of the objects themselves and the integrated enumerable properties

9, Object.hasownproperty () determines whether a property is an attribute of the object itself (including non-enumerable), and can be combined with a for to get all of its own enumerable properties

10, Object.getownpropertynames () gets all the property names of the object itself

JS objects in an array, method, object The direct assignment to other variables is a reference to the object, which will affect each other when the value is assigned. such as: Var aa={a:1,b:2};

The Var bb=aa;//directly assigns a value to the AA object, actually assigning a reference to the AA object to the BB

bb.a=2;

Console.log (AA);//object {a:2, B:2},AA results are affected.

The direct assignment of an object causes multiple effects in one place, so it is best to use the Copy method to assign the value.

The inheritance of objects in JS and the mystery of instantiation and shallow copy deep copy

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.