1. What is an object?

Objects are a collection of disordered attributes, including basic data types, objects, or functions.

2. How do you create objects?

1. Create an instance, such as:

             var  obj=new Object();

                     obj.name="XXXX";

                     obj.color="red"

                     ...................

2. Object literals, such as

            var  obj={

                   name:"XXXX",

                   color:"red",

                   ........................

           }

3. Attributes of the object?

1. Data Attribute: The location containing a data value where the written value can be read.

For example: var person={name:'FFFF'} //name is the data attribute of the object.

Accessor properties: do not contain data values, they contain a pair of child getter s and setter functions, but they are not required.

4. The characteristics of object attributes?

First, you must understand Object.defineProter(), define new attributes, or modify attributes.

Syntax: Object.defineProperty(obj, prop, descriptor)

Parameter description:

obj: required.Target object
prop: required.Name of the property to be defined or modified
descriptor: required.Attributes owned by the target attribute

Return value:

The object passed into the function.That is, the first parameter obj

For a property, we can set some properties on it, such as whether it is read-only and not writable, and whether it can be traversed by for..in or Object.keys().

Add attribute descriptions to an object's properties, which currently come in two forms: data descriptions and accessor descriptions.

Data Properties

When modifying or defining an attribute of an object, add some attributes to it:

var obj = {
    test:"hello"
}
//Object's Existing Attribute Add Attribute Description
Object.defineProperty(obj,"test",{
    configurable:true | false,
    enumerable:true | false,
    value:Any type of value,
    writable:true | false
});
//Property description of newly added attributes of the object
Object.defineProperty(obj,"newKey",{
    configurable:true | false,
    enumerable:true | false,
    value:Any type of value,
    writable:true | false
});

Attributes in the data description are optional, so let's look at the role of setting each attribute.

      [[value]]

Property corresponding value, can make any type of value, default is undefined

var obj = {}
//First case: value property is not set
Object.defineProperty(obj,"newKey",{

});
console.log( obj.newKey );  //undefined
------------------------------
//Second case: setting the value property
Object.defineProperty(obj,"newKey",{
    value:"hello"
});
console.log( obj.newKey );  //hello

     [[writable]]

Whether the value of an attribute can be overridden.Set to true to be overridden; set to false to not be overridden.Default to false.

var obj = {}
//First case: writable is set to false and cannot be overridden.
Object.defineProperty(obj,"newKey",{
    value:"hello",
    writable:false
});
//Change the value of newKey
obj.newKey = "change value";
console.log( obj.newKey );  //hello

//Second case: writable is set to true and can be overridden
Object.defineProperty(obj,"newKey",{
    value:"hello",
    writable:true
});
//Change the value of newKey
obj.newKey = "change value";
console.log( obj.newKey );  //change value

     [[enumerable]]

Whether this property can be enumerated (using for...in or Object.keys()).Set to true to be enumerated; set to false to not be enumerated.Default to false.

var obj = {}
//First case: enumerable is set to false and cannot be enumerated.
Object.defineProperty(obj,"newKey",{
    value:"hello",
    writable:false,
    enumerable:false
});

//Enumerate the properties of an object
for( var attr in obj ){
    console.log( attr );  
}
//Second case: enumerable is set to true and can be enumerated.
Object.defineProperty(obj,"newKey",{
    value:"hello",
    writable:false,
    enumerable:true
});

//Enumerate the properties of an object
for( var attr in obj ){
    console.log( attr );  //newKey
}

   [[configurable]]

Whether the target attribute can be deleted or the attributes of the attribute can be modified again (writable, configurable, enumerable).Set to true to delete or reset attributes; set to false, not to be deleted or reset attributes.Default to false.

This property serves two purposes:

1. Can the target attribute be deleted using delete

2. Whether the target attribute can set the attribute again

//--------------------------------------------------------------------------------------------------------------------------------------------------------
var obj = {}
//First case: configurable is set to false and cannot be deleted.
Object.defineProperty(obj,"newKey",{
    value:"hello",
    writable:false,
    enumerable:false,
    configurable:false
});
//Delete Properties
delete obj.newKey;
console.log( obj.newKey ); //hello

//Second, configurable is set to true and can be deleted.
Object.defineProperty(obj,"newKey",{
    value:"hello",
    writable:false,
    enumerable:false,
    configurable:true
});
//Delete Properties
delete obj.newKey;
console.log( obj.newKey ); //undefined

//--------------------------------------------------------------------------------------------------------------------------------------------------------
var obj = {}
//First case: configurable is set to false and the feature cannot be modified again.
Object.defineProperty(obj,"newKey",{
    value:"hello",
    writable:false,
    enumerable:false,
    configurable:false
});

//Re-modify features
Object.defineProperty(obj,"newKey",{
    value:"hello",
    writable:true,
    enumerable:true,
    configurable:true
});
console.log( obj.newKey ); //Error: Uncaught TypeError: Cannot redefine property: newKey

//Second case: configurable is set to true and the feature can be modified again.
Object.defineProperty(obj,"newKey",{
    value:"hello",
    writable:false,
    enumerable:false,
    configurable:true
});

//Re-modify features
Object.defineProperty(obj,"newKey",{
    value:"hello",
    writable:true,
    enumerable:true,
    configurable:true
});
console.log( obj.newKey ); //hello

In addition to setting attributes for newly defined attributes, you can also set attributes for existing attributes

//Attributes added when defining an object are deletable, rewritable, and enumerable.
var obj = {
    test:"hello"
}

//Overwrite Value
obj.test = 'change value';

console.log( obj.test ); //'change value'

Object.defineProperty(obj,"test",{
    writable:false
})


//Rewrite Value
obj.test = 'change value again';

console.log( obj.test ); //Still:'change value'

Tip: Once you add attributes to an object using Object.defineProperty, configurable, enumerable, writable are all default false values if the attributes are not set

var obj = {};
//After defining a new attribute, configurable, enumerable, and writable in the attribute are all default values false
//This results in the neykey being unable to override, enumerate, and set the attribute again
//
Object.defineProperty(obj,'newKey',{

});

//Set Value
obj.newKey = 'hello';
console.log(obj.newKey);  //undefined

//enumeration
for( var attr in obj ){
    console.log(attr);
}

Summary of the features of the settings:

Value:Set the value of the property
writable: Whether the value can be overridden.true | false
enumerable: Whether the target attribute can be enumerated.true | false
configurable: Can the target attribute be deleted or can the attribute true | false be modified again

Accessor Description

When using accessors to describe attributes of attributes, the following attribute properties are allowed to be set:

var obj = {};
Object.defineProperty(obj,"newKey",{
    get:function (){} | undefined,
    set:function (value){} | undefined
    configurable: true | false
    enumerable: true | false
});

Note: Wtable and value attributes are not allowed when getter or setter methods are used

getter/setter

A getter/setter method can be provided when setting or getting the value of a property of an object.

• Getters are a way to get attribute values

• setter is a way to set property values.

Use get/set attributes in attributes to define corresponding methods.

var obj = {};
var initValue = 'hello';
Object.defineProperty(obj,"newKey",{
    get:function (){
        //Function triggered when a value is obtained
        return initValue;    
    },
    set:function (value){
        //The function that is triggered when a value is set, and the new value set is taken by the parameter value
        initValue = value;
    }
});
//Get value
console.log( obj.newKey );  //hello

//Set Value
obj.newKey = 'change value';

console.log( obj.newKey ); //change value

Note: A get or set does not have to appear in pairs, just write it.If no method is set, the default values for get and set are undefined

Congurable and enumerable are the same as above.

Compatibility

It can only be used on DOM objects under ie8. Attempting to use Object.defineProperty() on native objects will cause an error.