JavaScript Object usage

Content Description: JavaScript is an object-oriented language. It inherits from the prototype mechanism and can be encapsulated through closures. This article discusses the special features of JavaScript objects: prototype chain, reference ,... content Description: JavaScript is an object-oriented language. It inherits from the prototype mechanism and can be encapsulated through closures. This article discusses the special features of JavaScript objects, such as prototype chain, reference, reflection, and attribute traversal.
I. Object Creation
JavaScript has a very intuitive object creation method:
Var emptyObject = {};
Var person = {
Name: 'harttle ',
Age: 24
};
Equivalent:
Var xx = new Object ();
Xx. name = 'hartle ';
Xx. age = 24;
2. Attribute access
Attributes can be accessed using two types of syntax:
Person. age
Person ['age']
If the property name does not exist, JavaScript searches for it along the prototype chain. You can update the value assignment or create an attribute. You can delete the attribute by deleting person. age.
If undefined is obtained, a TypeError is thrown, which is generally solved through:
// Person. girl === undefined
Person. girl. name; // TypeError
Person. girl & person. girl. name; // undefined
Iii. Prototype
The prototype Inheritance Method of JavaScript is cumbersome. The Object. create method is provided in es6. prototype inheritance becomes easier.
Its implementation is roughly like this:
If (typeof Object. create! = 'Function '){
Object. create = function (o ){
Var F = function (){};
F. prototype = o;
Return new F ();
};
}
Var obj = Object. create (proto );
If the attribute to be assigned/deleted comes from the prototype, JavaScript will also create/Delete the corresponding attribute for the current object, and the prototype attribute will not be affected.
The method of deleting an attribute by uploading person. age = undefined is equivalent to creating an attribute with the value of undefined. Delete person. age actually deletes the attribute, just as it has never been declared.
For example:
Var prot = {name: 'harttle '};
// Create p using the prot as the prototype
Var p = Object. create (prot );
Delete p. name; // p. name = 'harttle'. The object attributes of the prototype chain are not affected.
P. name = undefined; // p. name = undefined
Delete p. name; // p. name = 'harttle'. The properties of the prototype are obtained.
Undefined is a basic data type Undefined, which has only one value, namely undefined.
Iv. Object Reference
Objects in JavaScript are passed through references and will not be copied:
Var a = B = {};
A. name = 'harttle ';
B. name = 'harttle' // true
When the prototype is inherited, the prototype also enters the prototype chain as a reference, and the prototype attributes are not copied:
Var prot = {girl: {name: 'Alice '}};
Var p1 = Object. create (prot );
Var p2 = Object. create (prot );
P1.girl. name = 'fuck'; // p2.girl. name = 'fuck'
The prototype is a dynamic link.
5. Reflection
JavaScript is a dynamic language. You can obtain the type information at runtime through typeof:
Typeof p. age // 'number'
Typeof p. name // 'string'
Typeof p. toString // 'function', from prototype: Object. prototype
Typeof p. wing // 'undefined'
Of course, typeof has limited capabilities and can only check basic data types. To support object-oriented design, we need a more complex type judgment mechanism. For details, refer to how to check JavaScript types? Article.
6. Property Traversal
You can use for in to traverse object attributes (including prototype attributes ):
Var person = {name: 'harttle', age: 24 };
For (var prop in person ){
Console. log (p [prop );
}
To obtain only the attributes of the current object, you can use hasOwnProperty to determine:
For (var prop in person ){
If (person. hasOwnProperty (prop )){
Console. log (p [prop );
}
}
For in does not guarantee the order of attributes. If you need to ensure the order, you can use Array instead. It also avoids determining attributes from the prototype.
7. Avoid global variables
Dependency on global variables is one of the design flaws of JavaScript. There are many ways to avoid using global variables. The simplest one is to define a global variable for your project and define only one global variable:
Var APP = {};
APP. foo = 'xxx ';
APP. bar = 'xxx ';
In this way, the code is easier to maintain and change. After all, APP. foo is a global variable at a glance.