ECMAScript 对象操作的14中方法

      在JS 操作对象中，我们使用的大部分都是关键字指令，但是ECMAScript 委员会给出了14种底层操作的方法（直接操作对象），这种底层方法都是函数式的，不但容易读懂，也更容易维护。

1、获取原型  [ [ GetPropetyOf ] ]

用法：Object.getPrototypeOf(_obj)，这种用法直接操作对象，与使用关键字指令__proto__，prototype得到的结果是一样的。

var _obj = {
  a: 1,
  b: 2
}
var obj = Object.getPrototypeOf(_obj)
console.log(obj);
console.log(_obj.__proto__);
console.log(Object.prototype);

控制台输出，可以看到输出结果都是一样的：

 2、设置原型  [ [ SetPrototypeOf ] ]

用法：Object.setPrototypeOf( _obj , { ...... })

var _obj = {
  a: 1,
  b: 2
}
Object.setPrototypeOf(_obj, {
  c: 3,
  d: 4,
  add () {
    console.log('add');
  }
})
console.log(_obj);

控制台输出，可以看到成功在原型上设置了属性和方法：

 3、获取对象的可扩展性  [ [ IsExtensible ] ]

用法：Object.isExtensible(_obj)

封闭对象 Object.seal(_obj) ：不可修改，不可删除，可读可写；

冻结对象 Object.freeze(_obj) ：不可修改，不可删除，不可写，可读。

var _obj = {
  a: 1,
  b: 2
}
var extensible = Object.isExtensible(_obj)
console.log(extensible) //true

// 封闭对象--->不可修改
Object.seal(_obj)
_obj.c = 3
console.log(_obj);
// 不可删除
delete _obj.a
console.log(_obj);
// 可写
_obj.b = 5
console.log(_obj);
// 可读
for (var key in _obj) {
  console.log(_obj[key]);
}

// 冻结对象 ---> 不可修改
Object.freeze(_obj)
_obj.c = 3
console.log(_obj);
// 不可删除
delete _obj.a
console.log(_obj);
// 不可写
_obj.b = 6
console.log(_obj);
// 可读
for (var key in _obj) {
  console.log(_obj[key]);
}

控制台输出：

 4、获取自有属性  [ [ GetOwnProperty ] ]

用法：Object.getOwnPropertyNames(_obj)

var _obj = {
  a: 1,
  b: 2
}
Object.setPrototypeOf(_obj, {
  c: 4,
  d: 5
})
var obj = Object.getOwnPropertyNames(_obj)
console.log(_obj); 
console.log(obj); //只能打印出自己本身的属性a、b

控制台输出：

 

  5、禁止扩展对象 [ [ PreventExtensions ] ]

用法：Object.preventExtensions(_obj)

var _obj = {
  a: 1,
  b: 2
}
Object.preventExtensions(_obj)
// 禁止增加属性
_obj.c = 3
console.log(_obj);

// 允许删除属性
delete _obj.a
console.log(_obj);

// 允许修改
_obj.b = 4
console.log(_obj);

控制台输出：

 

 6、拦截对象操作 [ [ DefineOwnProperty ] ]

用法：Object.defineProperty(_obj, 'a', {  属性设置  } )

对象属性存在如下描述符：

• configurable – 是否可配置
• enumerable – 是否可枚举
• value – 属性值
• writable – 是否可写

var _obj = {
  a: 1,
  b: 2
}
//defineProperty(要拦截的对象,属性名称,{描述器})
Object.defineProperty(_obj, 'a', {
  // 拦截a不可修改
  writable: false
})
console.log(_obj)

// 允许新加属性
_obj.c = 4
console.log(_obj)

// 默认writable 为 true ,不可改a
_obj.a = 5
console.log(_obj)

// 默认configurable 为 true ,可删
delete _obj.a
console.log(_obj)

// 默认enumerable 为 true ,可枚举
for (const key in _obj) {
  console.log(_obj[key])
}

控制台输出：

 

 7、判断是否是自身属性 [ [ HasProperty ] ]

用法：_obj.hasOwnProperty('a')

var _obj = {
  a: 1,
  b: 2
}
Object.setPrototypeOf(_obj, { c: 3, d: 4 })
console.log(_obj)
console.log(_obj.hasOwnProperty('a'))
console.log(_obj.hasOwnProperty('c'))

控制台输出：

 

 8、 [ [ GET ] ]

var _obj = {
  a: 1,
  b: 2
}
// get机制一般用于判断属性(自有属性、原型属性)是否在对象中
console.log('a' in _obj)
console.log('c' in _obj)
// 基于get实现对象的属性值读取
console.log(_obj.a)

控制台输出：

 

  9、 [ [ SET ] ]

var _obj = {
  a: 1,
  b: 2
}
// set一般对象设置值
_obj.a = 3
_obj.b = 4
console.log(_obj)

控制台输出：

 

 10、 [ [ Delete ] ]

var _obj = {
  a: 1,
  b: 2
}
delete _obj.a
console.log(_obj)

控制台输出：

 

 11、 [ [ Enumerate ] ]

var _obj = {
  a: 1,
  b: 2,
  c: 3,
  d: 4
}
for (let key in _obj) {
  console.log(_obj[key])
}

控制台输出：

 

 12、自有属性键集合 [ [ OwnPropertyKeys ] ]

用法：Object.keys(_obj)

var _obj = {
  a: 1,
  b: 2
}
Object.setPrototypeOf(_obj, { c: 3 })
console.log(_obj)
console.log(Object.keys(_obj)) 

控制台输出：

 

 13、调用函数

用法：Object.keys(_obj)

function test() {}
test() // 引用值的调用

var obj = {}
obj.test = function () {}
obj.test()

 14、实例化对象

用法：Object.keys(_obj)

function Test() {}
// 实例化对象的操作
var test = new Test()