Basic of JavaScript object-oriented technology (I)

I have read a lot about the Javascript object-oriented technology.Article, Dizzy. Why? Not because of poor writing, but because it is too esoteric.
The objects in Javascript have not yet explained what is going on. When it comes up, we will go straight to the topic, class/Inheritance/prototype/private variable ....
As a result, after reading it for a long time, I had a rough understanding and had a good aftertaste. It seems that I didn't understand anything...
This article is written in chapter 7, 8 and 9 of <JavaScript-the definitive guide, 5th edition>.
The javascript object-oriented technology (Object/array-> function-> class/constructor/prototype) will be explained according to the structure of the original book as much as possible ). I will attach the original English statement for your reference.
If no description is provided, all English statements (ProgramExcept for the object) are all imported from <JavaScript-the definitive guide, 5th edition>.

-------------------------------------------------
Objects and arrays (objects and arrays)
What is an object? Put a combination of "name-attribute" in a unit to form an object. We can understand it as JavaScript.
The object is a set of "key-value" pairs (an object is a collection of named values. These named values are usually referred
To as properties of the object. -- section3.5 ).
"Name" can only be string type, not other type, and the attribute type is
Any (number/string/other object...) .. you can use new object () to create an empty object. You can also use "{}" to create an empty object.
Empty object. The two functions are equivalent.

JS Code

2. VaREmptyobject1 = {};// Create an empty object
4. VaREmptyobject2 =NewObject ();// Create an empty object
6. VaRPerson = {"Name":"Sdcyst",
8. "Age": 18,
10. "Sex":"Male"};// Create an object person with an initial value
12. Alert (person. Name );// Sdcyst
14. Alert (person ["Age"]);// 18

VaR emptyobject1 ={}; // create an empty object var emptyobject2 = new object (); // create an empty object var person = {"name": "sdcyst", "Age ": 18, "sex": "male"}; // create an object with an initial value, personalert (person. name); // sdcystalert (person ["Age"]); // 18
 

From the above example, we can also see that accessing the attributes of an object can simply add "." With the object name followed by the attribute name
You can use the "[]" operator to obtain the attribute name. In this case, the attribute name in [] must be enclosed by quotation marks, because the indexes in the object are of the string type.
The number of attributes in an object is variable. After an object is created, you can assign any attributes to it at any time.

JS Code

2. VaRPerson = {};
4. Person. Name ="Sdcyst";
6. Person ["Age"] = 18;
8. Alert (person. Name +"__"+ Person. Age );// Sdcyst _ 18
12. VaR_ Person = {Name:"Balala","Age": 23 };// When constructing an object, the attribute name can be marked with no quotation marks (name ),
14. // But it is still a string type. quotation marks are still required in [] during access.
16. Alert (_ person ["Name"] +"__"+ Person. Age );// Balala _ 23
18. Alert (_ person [name]);// Undefinied

 
VaR person = {}; person. name = "sdcyst"; person ["Age"] = 18; alert (person. name + "_" + person. age); // sdcyst _ 18var _ person = {name: "Balala", "Age": 23}; // when constructing an object, the attribute name can be marked with no quotation marks (name), // but it is still a string type. alert (_ person ["name"] + "_" + person. age); // Balala _ 23 alert (_ person [name]); // undefinied
 

When you use the "." operator to get the object attributes, you must know the attribute name. Generally, the "[]" operator has more powerful functions to get object attributes,
You can add some expressions in [] to get the attribute value,
For example, it can be used in loop control statements, but the "." operator does not have this flexibility.

JS Code

2. VaRName = {"Name1":"Name1","Name2":"Name2","Name3":"Name3","Name4":"Name4"};
4. VaRNamestring ="";
6. For(VaRPropsInName ){// The attribute name in the loop name object
8. Namestring + = Name [props];
10. }
12. Alert (namestring );// Name1name2name3name4
16. Namestring ="";
18. For(VaRI = 0; I <4; I ++ ){
20. Namestring + = Name ["Name"+ (I + 1)];
22. }
24. Alert (namestring );// Name1name2name3name4

 
VaR name = {"name1": "name1", "name2": "name2", "name3": "name3", "name4": "name4 "}; vaR namestring = ""; for (VAR props in name) {// name of the attribute in the loop name object namestring + = Name [props];} alert (namestring ); // name1name2name3name4namestring = ""; for (VAR I = 0; I <4; I ++) {namestring + = Name ["name" + (I + 1)];} alert (namestring); // name1name2name3name4
 

The delete operator can delete an attribute of an object and determine whether a property exists. The "in" operator can be used.

JS Code

2. VaRName = {"Name1":"Name1","Name2":"Name2","Name3":"Name3","Name4":"Name4"};
4. VaRNamestring ="";
6. For(VaRPropsInName ){// The attribute name in the loop name object
8. Namestring + = Name [props];
10. }
12. Alert (namestring );// Name1name2name3name4
16. DeleteName. name1;// Delete the name1 attribute
18. DeleteName ["Name3"];// Delete the name3 attribute
20. Namestring ="";
22. For(VaRPropsInName ){// The attribute name in the loop name object
24. Namestring + = Name [props];
26. }
28. Alert (namestring );// Name2name4
32. Alert ("Name1" InName );// False
34. Alert ("Name4" InName );// True

 
VaR name = {"name1": "name1", "name2": "name2", "name3": "name3", "name4": "name4 "}; vaR namestring = ""; for (VAR props in name) {// name of the attribute in the loop name object namestring + = Name [props];} alert (namestring ); // name1name2name3name4delete name. name1; // Delete the name1 attribute Delete name ["name3"]; // Delete the name3 attribute namestring = ""; for (VAR props in name) {// The attribute name namestring + = Name [props];} alert (namestring); // name2name4alert ("name1" in name ); // falsealert ("name4" in name); // true
 

Note that the attributes in the object are unordered.

Constructor attribute of the object
Each JavaScript Object has a constructor attribute. This attribute corresponds to the constructor during object initialization (the function is also an object ).

JS Code

1. var date = New date ();
2. alert (date. constructor); // Date
3. alert (date. constructor = "date" ); // false
4. alert (date. constructor = date); // true