Make a summary every day, persistence is victory!

/** @date 2021-06-19 @description object.defineProperty (Copy the code

One (sequence)

Object’s defineProperty method, used to add or modify attributes on an Object, is called through Object.defineProperty(), not on an Object instance, because it is a direct method on Object, not prototype.

The defineProperty method takes three arguments:

  1. Object to be processed (obJ);

  2. The name of the property or Symbol (prop) that the object needs to work with;

  3. Attribute descriptors to be modified (descriptor ();

) returns the object after the operation.

Two (distinct from the. Operator or the [] operator)

The defineProperty operator and [] operator can also be used to add or modify a property. However, using defineProperty, you can do more operations, such as enumerable, configurable, etc. The third parameter is different.

Descriptors fall into two categories, data descriptors and access descriptors;

Only one of the two descriptors can be passed in. The common parameters of the two descriptors are:

/** * Enumerable: No... In or object.keys () read), which defaults to false; * 64x: Works without any additional control system. The default value is false. * /Copy the code

The parameters specific to the data descriptor are:

/** * value: current object property value, default is undefined; * writable: writable (value can be changed), default is false; */ // test const obj = {}; Object.defineProperty(obj, 'a', { enumerable: true, configurable: true, value: 1, writable: true, }) Object.keys(obj); // ['a'] Object.defineProperty(obj, 'a', { enumerable: false, configurable: true, value: 1, writable: true, }) Object.keys(obj); // [] obj.a = 2; console.log(obj); // {a: 2} Object.defineProperty(obj, 'a', { enumerable: false, configurable: true, value: 1, writable: false, }) obj.a = 2; console.log(obj); // {a: 1} Object.defineProperty(obj, 'b', { enumerable: false, configurable: false, value: 1, writable: false, }) delete obj.a; // true delete obj.b; // falseCopy the code

The specific parameters of the access descriptor are:

/** * get: the getter function for the property, which must be a function, returns undefined * if there is one, returns the value returned by the function; Default is undefined; * set: a setter function for a property, which must also be a function, otherwise an error is reported. */ / test const obj = {}; let value = 1; Object.defineProperty(obj, 'b', { enumerable: true, configurable: true, get: function() { return value; }, set: function(newValue) { value = newValue * newValue; }, }) console.log(obj.b); // 1 obj.b = 2; console.log(obj.b); / / 4Copy the code

Three (extended, from JS you don’t know)

  1. Object is constant
Const obj = {}; /** * const obj = {}; Object.defineProperty(obj, 'a', { value: 1, writable: false, configurable: false, enumerable: True, // no, I think it needs to be enumerable})Copy the code
  1. Prohibit extensions
/** * To prevent an Object from adding new properties, use object.preventExtensions () */ const obj = {a: 1}; Object.preventExtensions(obj); console.log(obj); // {a: 1} obj.b = 2; console.log(obj); // {a: 1}Copy the code
  1. seal
/** * Use object.seal () to seal an Object. Attributes cannot be added, deleted, or reconfigured. It is possible to modify * by calling Object.preventExtensions() and setting all properties to false */Copy the code
  1. freeze
/** * Freeze () to freeze an Object. The Object cannot be added, modified, deleted, or configured. * This actually calls Object.seal() and sets the writable of all data access properties to false. Getters and setters are unaffected, and second, the reference properties of the object can be modified. */ const obj = {a: 1, c: {d: 3}}; let b = 2; Object.defineProperty(obj, 'b', { get: function() { return b }, set: function(val) { b = val } }); Object.freeze(obj); obj.a = 3; console.log(obj.a); // 1 obj.b = 4; console.log(obj.b); // 4 obj.c.d = 5; console.log(obj.c.d); / / 5Copy the code