Detailed methods common object of ES5

ECMAScript 5 adds a host of new object methods to JavaScript, as follows

Read catalog

• Object.defineProperty (Object, Property, descriptor) // add or change object attributes
• Object.defineProperties (Object, descriptors) // add or change multiple object properties
• Object.keys (Object) // returns an array of all enumerable properties
• Object.freeze (Object) // prevent any changes to the object
• Object.isFrozen (Object) // If the object is frozen, returns true
• Object.getOwnPropertyDescriptor (Object, Property) // access properties
• Object.getOwnPropertyNames (Object) // array to return all properties

Before telling the following object methods, it is necessary to first understand the object properties associated method, it is conducive to more deeply familiar object methods

Object attribute descriptor

Concept: two main forms of decibels data descriptor, and access descriptor;

         Data Descriptor - is a property having a value, the value may be written to, may not be written, including configurable, enumerable, writable, value;

         Access Descriptor - is a function of the getter-setter properties described herein, including get and set methods, and can replace the value writable

　　   NOTE: attribute descriptor "Object.defineProperty or objects can be used only in Object.defineProperties.

Object.defineProperty(object, property, descriptor)

Concepts: used to define a new attribute on an object, or modify existing properties of an object and return the object

Features: use Object.defineProperty () defined attributes, the default is not to be modified, can not be enumerated, can not be deleted, a reference case; To modify the properties of an object need to be modified by setting the attribute descriptor success, refer to case 2;

Note: Setting set or get, you can not set the value and wriable, otherwise it will error, refer to Case 3

Case 1:

var obj = {}; 
Object.defineProperty (obj, 'name' , { 
value: 'definePropertyTest' 
}); 
the console.log ( 'obj Default:' , obj);
 Delete obj.name; 
the console.log ( 'obj after deleting: ' , obj); 
the console.log ( ' obj enumeration: ' , Object.keys (obj)); 
obj.name =' definePropertyTest1 ' ; 
the console.log ( ' modified after obj: ' , obj);
      

Output

Case 2:

var obj = {}; 
Object.defineProperty (obj, 'name' , { 
value: 'definePropertyTest' , 
Writable: to true ,        // can be modified 
Enumerable: to true ,      // can be enumerated 
Configurable: to true ,    // can be remove 
}); 
the console.log ( 'obj default:' , obj); 
the console.log ( 'obj enumeration:' , Object.keys (obj)); 
obj.name = 'definePropertyTest1' ; 
the console.log ( ' obj modified: ' , obj);
 Delete obj.name; 
the console.log ('After obj deleted:', obj);

Output

Case 3:

var obj = {};
Object.defineProperty(obj, 'name', {
// value: 'definePropertyTest',
// writable: true, 放开注释则会报Invalid property descriptor. Cannot both specify accessors and a value or writable attribute
enumerable: true,     
configurable: true, 
get: function () {    
  console.log('get', this);
  return 'name ' + this.__name;
},  
set: function (newVal) {
      localStorage.setItem('name', newVal);
      console.log('set', newVal);
      this.__name = newVal;
}
});
console.log('obj默认值:', obj);
obj.name = 'definePropertyTest';
console.log('obj枚举:', Object.keys(obj)); 
delete obj.name;
console.log('obj删除后:', obj); 

输出结果

Object.defineProperties(object, descriptors)

概念：在对象上定义多个新的属性或者修改多个原有属性，返回修改后的目标对象

特点：与Object.defineProperties()方法相同，区别为可以对多个属性进行定义和修改

案例：

var obj = {};
Object.defineProperties(obj, {
    name:{
        enumerable: true,     
        configurable: true, 
        get: function () {    
          return this.__name;
        },  
        set: function (newVal) {
              this.__name = 'definePropertyTest';
        }
    },
    age:{
        enumerable: true,     
        configurable: true, 
        get: function () {    
          return this.__age;
        },  
        set: function (newVal) {
              this.__age = '18';
        }
    },

});
console.log('obj默认值:', obj);
console.log('obj枚举:', Object.keys(obj));
obj.name = 'definePropertyTest1';
obj.age = 19;
console.log('修改后:', obj); //set方法进行了拦截，无法修改
delete obj.name;
delete obj.age;
console.log('obj删除后:', obj); //无法删除

输出结果

Object.keys(object)

概念：返回对象的可枚举属性和方法，返回类型为数组，数组中属性名的排列顺序和使用 for...in 循环遍历该对象时返回的顺序一致

注：在ES5里，如果此方法的参数不是对象（而是一个原始值），那么它会抛出 TypeError。在ES2015中，非对象的参数将被强制转换为一个对象

案例：

var obj = {
    key1:1,key2:2
}
console.log(Object.keys(obj)) //['key1','key2']
//传入数组或字符串，返回索引
var arr = ['key1','key2'];
var string = "key";
console.log(Object.keys(arr)) //["0","1"]
console.log(Object.keys(string)) //["0","1","2"]
//传入构造函数 返回空数组或者属性名
function TestObjectKey(name,age){
    this.name = name;
    this.age = age;
    this.toString = function(){
        return 'toString';
    }
}
console.log(Object.keys(TestObjectKey)); //[]
var key = new TestObjectKey("key1",18);
console.log(Object.keys(key)); // ["name", "age", "toString"]

Object.freeze(object)

概念：冻结一个对象，返回和传入的参数相同的对象

特点：冻结的对象不能被修改，不能向对象添加新的属性，不能删除已有属性，不能修改属性的性质包括可枚举性、可配置性、可写性、以及不能修改已有属性的值，该对象的原型也不能修改

注：冻结对象不是常量对象（浅冻结）

案例：

const obj1 = {
    name:"freeze1"
}
Object.freeze(obj1);
const obj2 = Object.freeze(obj1);
console.log(obj1===obj2); //true 返回原来的对象
obj1.name = "freeze1";
console.log(obj1); //{name:"freeze1"} 冻结的对象不可更改
delete obj1.name
console.log(obj1); //{name:"freeze1"} 冻结的对象不可删除
obj1.age = 18;
console.log(obj1) //{name:"freeze1"} 冻结的对象不可添加属性
const obj3 = {
    internal:{}
}
Object.freeze(obj3);
obj3.internal.name = "freeze3";
console.log(obj3) //{internal:{name:freeze3}} 冻结的对象不是常量对象-浅冻结
var arr = ["freeze"];
Object.freeze(arr);
arr[1] = "freeze1";
console.log(arr) //冻结的数组不能修改，其它同对象

Object.isFrozen(object)

概念：返回给定对象是否冻结的Boolean

特点：一个对象默认是非冻结的，冻结的对象不可扩展，不可配置

案例：

var obj = {};
console.log(Object.isFrozen(obj)); //空对象默认是非冻结的
var obj1 = {
    name:'isFrozen'
}
console.log(Object.isFrozen(obj1)); //非空对象默认是非冻结的
var obj2 = Object.freeze(obj);
console.log(Object.isFrozen(obj)); //true 冻结对象是冻结的
console.log(Object.isFrozen(obj2)); //true 冻结对象的拷贝也是冻结的

Object.getOwnPropertyDescriptor(object, property)

概念：返回指定对象上一个自有属性对应的属性描述符

案例：

var obj = {name:"getOwnPropertyDescriptor"}
Object.getOwnPropertyDescriptor(obj,"name"); 
// {
//   value: "getOwnPropertyDescriptor",
//   writable: true,
//   enumerable: true
//   configurable：true
// }
var obj1 = {};
Object.defineProperty(obj1, "name", {
  value: "getOwnPropertyDescriptor",
  writable: false,
  enumerable: false
});
Object.getOwnPropertyDescriptor(obj1, "name");
// {
//   value: "getOwnPropertyDescriptor",
//   writable: false,
//   enumerable: false，
//   configurable：false
// }

Object.getOwnPropertyNames(object)

概念：返回一个由指定对象的所有自身属性的属性名组成的数组

案例：

var obj = {};
Object.getOwnPropertyNames(obj); //[]
var arr = ["a","b","c"];
Object.getOwnPropertyNames(arr); //["0", "1", "2", "length"]

 

参考网站
https://segmentfault.com/a/1190000019446677