Object format
-
The basic format
The object is wrapped with a {} and its internal properties are declared as key-value pairs
-
The sample
var teacher = { name: "pgjett".age: "22".teach: function () { console.log("I teach javascript"); }, drink: function () { console.log("I drink beer"); }}Copy the code
Object property
-
Add, delete, change and check attributes
var teacher = { name: "pgjett".var teacher = { name: "pgjett".age: "22".teach: function() { console.log("I teach javascript"); }, drink: function() { console.log("I drink beer"); }}/ / add teacher.smook = function(){ console.log("I smook"); } / / delete delete teacher.name; / / change teacher.teach =function() { console.log("I teach java"); } // Find/access console.log(teacher.name); console.log(teacher["name"]); // The earliest JS engines used obj["name"] // using obj. Name automatically converts to obj["name"] Copy the code
-
Object methods access properties
Ordinary functions are called functions and functions within objects are called methods
var teacher = { name: "pgjett".age: "22".weight: "65".teach: function() { console.log("I teach javascript"); }, eat: function() { this.weight++; console.log("I eat, my weight is " + this.weight); } } teacher.eat(); Copy the code
-
Object method with arguments
var attendance = { students: [].join: function(name) { this.students.push(name); console.log(name + "Class has arrived"); }, leave: function(name) { var idx = this.students.indexOf(name); if(idx ! = -1) { this.students.splice(idx, 1); console.log(name + "Early"); } } } attendance.join("Zhang"); attendance.join("Bill"); attendance.join("Fifty"); attendance.join("Daisy"); attendance.join("Seven sun"); attendance.leave("Bill"); // Zhang SAN has arrived in class // Li Si has arrived in class // Wang Wu has arrived in class // Zhao Liu has arrived in class // Sun Qi has arrived at class // Li Si left early Copy the code
How objects are created
-
Object literals
Also called object direct quantity
var obj = { name: "Jett".age: 22"" } Copy the code
-
Built-in constructor
Use new Object(), which is no different from the direct Object quantity
var obj = new Object(a); obj.name ="Jett"; obj.age = "22"; Copy the code
-
Custom constructors
Custom constructors are named with large humps, create object instances with new, and new examples are different objects with their own properties
Custom constructors are an important part of javascript modularization and plug-in
function Teacher(){ this.name = "Jett"; this.age = 22; this.teach =function(){ console.log("I teach javascipt"); }}var teacher1 = new Teacher(); var teacher2 = new Teacher(); teacher2.name = "John"; console.log(teacher1); console.log(teacher2); // Teacher{name: "Jett", age: 22, teach: teach(){}} // Teacher{name: "John", age: 22, teach: teach(){}} Copy the code
Custom constructors pass in parameters
function Teacher(opt) { this.name = opt.name this.age = opt.age; this.teach = function() { console.log("I teach "+ opt.course); }}var teacher1 = new Teacher({ name: "Jett".age: 22.course: "javascript" }); var teacher2 = new Teacher({ name: "John".age: 25.course: "java" }); Copy the code
Constructor principle
-
This point
Do not use new, execute directly, according to precompilation principle, this points to window by default
In the global scope, this stands for window
function Car() { this.color = "red"; this.brand = "BMW"; } Car(); console.log(window.color); console.log(this.color); // red // red Copy the code
Instantiate the object with new, and this points to the instance
function Car() { this.color = "red"; this.brand = "BMW"; } var car = new Car(); console.log(car.color); Copy the code
-
This is the process of transformation
When a constructor is new, the constructor is executed and its AO will have a this pointing to a default property
When you perform
this.color = "red"; this.brand = "BMW"; Copy the code
Equivalent to adding an attribute to this
Using the new keyword throws this and assigns it to a reference
This is an instance object that has access to the color and brand attributes
-
Return in the constructor
New A constructor returns this implicitly by default
If you explicitly return a raw value, the instance object is not affected
If you explicitly retrn a reference value, the new instance points to that reference value
function Car() { this.color = "red"; this.brand = "BMW"; return 1; } var car = new Car(); console.log(car.color); // red Copy the code
A wrapper class
-
Number
The constructor is used to create a numeric object, and properties can be set
In the operation can be automatically unpacked
Similarly, String, Boolean
var a = new Number(1); a.name = "a"; console.log(a); console.log(a + 1); / / print // Number{1, name: "a"} / / 2 Copy the code
Primitive custom methods and properties are wrapped as objects of the corresponding type each time they are accessed. They are only temporary containers that are destroyed after execution and then rewrapped again. Only undefined can be accessed
var a = 1; a.name = "a"; // The js engine wraps a as a numeric object, // New Number(a).len = 3 // The temporary container has no variables to hold. Execute delete to remove the len attribute console.log(a.name); / / that the console. The log (new Number (a). Len) / / print undefined Copy the code
-
String
The original string value does not have the length property, but is actually wrapped as a string object and accessed by the length property
// The js engine wraps "123" as a string object var str = "123"; str.length = 1; // new String(STR).length = 1; console.log(str.length); / / that the console. The log (new String (STR). Length) / / print 3 Copy the code
Object chain call
Throw an object by return this to call other functions
var sched = {
marning:function(){
console.log("marning studying");
return this;
},
noon:function(){
console.log("noon sleeping");
return this;
},
afternoon:function(){
console.log("afernoon shopping");
return this;
}
}
sched.marning().noon().afternoon();
Copy the code
Object property enumeration
-
For in traverses object properties
var obj = { name: "Jett".age: 22.address: "Anhui province" } for( var key in obj) { console.log(key, obj[key]); } // name Jett // age 22 / / address in anhui province Copy the code
-
Use in to determine whether an object has a property
var obj = { name: "Jett".age: 22.address: "Anhui province" } console.log("name" in obj); // true Copy the code