Details of Object for JavaScript type system

  • 2020-11-20 06:00:56
  • OfStack

In front of the word

In javascript, objects are king; Almost everything in Javascript is an object or works like an object. When you understand the object, you understand Javascript. In javascript, a reference type is a data structure used to organize data and functionality together, and is often referred to as a class. Reference types are sometimes called object definitions because they describe the properties and methods that class 1 objects have

Most values of reference types are instances of Object type; Also, Object is the most used type in javascript. While Object instances don't have much functionality, they are certainly ideal for storing and transferring data in your application

Create an object

There are two types of Object creation methods

[1]Object constructor


var person = new Object();
// If you do not pass arguments to the constructor, you can do so without parentheses  var person = new Object;
person.name = 'bai';
person.age = 29; 
// Creates an empty object with no attributes 
var cody1 = new Object();
var cody2 = new Object(undefined);
var cody3 = new Object(null);
console.log(typeof cody1,typeof cody2, typeof cody3);//object object object 
// create string , number , array , function , boolean , regex
console.log(new Object('foo'));
console.log(new Object(1));
console.log(new Object([]));
console.log(new Object(function(){}));
console.log(new Object(true));
console.log(new Object(/\bbt[a-z]+\b/));

[Note] The Object() constructor is itself an object, and the constructor is an object created based on the Function constructor

[2] Use object literals

Javascript provides shortcuts called literals for creating most native object values. Using literals only hides the same as using the new operator

The basic process


var person = {
name : 'bai',
age : 29,
5 : true
};

[Note] Using commas in object literals to separate different attributes, but adding commas after the last one will cause an error in IE7-

The object is defined using the object literal method, and the property name is automatically converted to a string


// Same as above 
var person = {
'name' : 'bai',
'age' : 29,
'5' : true
};

If you leave its curly braces empty, you can define an object that contains only the default properties and methods


// Is equivalent to var person = new Object();
var person = {}; 
[tips] Use object literals to encapsulate multiple optional parameters 
function displayInfo(args){
var output = '';
if(typeof args.name == 'string'){
output += 'name:' + args.name +'\n';
}
if(typeof args.age == 'number'){
output += 'Age:' + args.age + '\n';
}
console.log(output);
};
displayInfo({
name: 'Nicholas',
age: 29
});
displayInfo({
name: 'match'
});

The above pattern of passing parameters is best suited for situations where you need to pass in a large number of optional parameters to a function. In general, while named parameters are easy to handle, they are not flexible when there are multiple optional parameters. Therefore, you use formal parameters for mandatory values and object literals to encapsulate multiple optional parameters

Set the object

There are two ways to access an object's properties. You can get, set, or update an object's properties using dot notation or bracket notation

The two advantages of the parenthesized method are that the property can be accessed through variables and the property name can be an invalid identifier for Javascript

[Note] Chinese can exist in the variable because Chinese is equivalent to a character and is treated like an English character, so it can be written as person. White or person[' white ']


var myObject = {
123:'zero',
class:'foo'
};
console.log(myObject['123'],myObject['class']);//'zero' 'foo'
console.log(myObject.123);// An error 

If the value in square brackets is of a non-string type, String() is implicitly converted to a string and then output. If it is a string type, the original value is output if there are quotes, otherwise it will be recognized as a variable, and if the variable is not defined, an error will be reported


person[0] = 1; //[] The number in is not reported as an error, but is automatically converted to a string 
person[a] = 1; //[] Elements that conform to the naming rules of variables are treated as variables. Variables are not defined and an error is reported 
person[''] = 2; //[] An empty string in , Is real and can be called , But it will not show up in the collection on the right side of the console 
person[undefined  or  null  or  true  or  false] = 4;//  Does not report an error, but is automatically converted to a string 
person[' white '] = 6; //  Not an error  

Delete the object

The delete operator can be used to completely remove attributes from an object. delete is the only way to remove a property from an object. Setting a property to undefined or null only changes the value of the property, not removes the property from the object. delete can only delete the data under the object, the other five basic types of values are not deleted

[Note]delete does not delete properties found on the prototype chain


var foo = {bar: 'bar'};
delete foo.bar;
console.log('bar' in foo);//false 
var a = 123;
delete a;
console.log(a);//123

If the variable a is declared in global state, equivalent to one data under the window object, a can be assigned via window.a or a, and the values of window.a and a are always the same, but cannot be deleted


var a;
a = 10;
console.log(a,window.a);//10 10
window.a = 20;
console.log(a,window.a);//20 20
delete a ;
console.log(a,window.a);//20 20
delete window.a;
console.log(a,window.a);//20 20

console.log (b) indicates that the variable does not exist, and console.log (ES110en.b) indicates that the variable does not exist


window.b = 10;
console.log(b,window.b);//10 10
delete b;
console.log(b);// An error 
console.log(window.b);//undefined 
window.b = 10;
console.log(b,window.b);//10 10
delete window.b;
console.log(b);// An error 
console.log(window.b);//undefined 

Nested object

Objects can be nested, but must be evaluated layer by layer


var student = {
name : {
chinese : 1,
englisth : 2
},
sex : 1,
age : 26
}

[Note] Values can only be taken one layer at a time, such as ES121en.name.chinese, but not across name. Use student.chinese directly, because the same level as name may also have elements called chinese


var person = {
name : 'bai',
age : 29,
5 : true
};
0

Instance methods

constructor: Holds the function used to create the current object
hasOwnProperty(propertyName): Used to check whether a given attribute exists in the current object instance, rather than in the prototype of the instance. Where propertyName must be specified as a string

isPrototypeOf(object): Used to check if the incoming object is the prototype of the incoming object

propertyIsEnumerable(propertyName): Used to check whether a given attribute can be enumerated using the for-ES150en statement. Where propertyName must be specified as a string

toLocaleString(): Returns a string representation of the object that corresponds to the locale of the execution environment

toString(): Returns a string representation of the object

valueOf(): Returns a string, numeric, or Boolean representation of an object, usually the same as the return value of the toString() method


var person = {
name : 'bai',
age : 29,
5 : true
};
1

Summary:

Object type

An object is simply a collection of 1 sets of data and functions. An object can be created by executing the new operator followed by the name of the object type to be created. By creating an instance of type Object and adding properties and/or methods to it, you can create a custom object.


var person = {
name : 'bai',
age : 29,
5 : true
};
2

Each instance of Object has the following properties and methods:

● constructor -- Holds the function used to create the current object
● hasOwnProperty(propertyName) -- Used to check whether a given property exists in the current object instance, rather than in the prototype of the instance. Where the attribute name (propertyName) as a parameter must be specified as a string (for example: o.hasOwnProperty ("name"))
● isPrototypeOf(object) -- Used to check if the incoming object is a prototype of another object
● propertyIsEnumerable(propertyName) -- Used to check whether a given attribute can be enumerated using the ES198en-ES199en statement
● toString() -- Returns a string representation of the object
● valueOf() -- Returns a string, numeric, or Boolean representation of an object. The return value is usually the same as that of the toString() method.


Related articles: