(80)Wangdao.com第十六天_JavaScript Object 对象的相关方法

时间 2019-11-08

标签 wangdao.com wangdao com 第十六 javascript object 对象相关方法栏目 JavaScript 繁體版

原文原文链接

Object 对象的相关方法数组

Object.getPrototypeOf()

返回参数对象的原型。

这是获取某对象的原型对象的标准方法。

var F = function () {};
var f = new F();
Object.getPrototypeOf(f) === F.prototype    // true

几种特殊对象的原型

// 空对象的原型是 Object.prototype
Object.getPrototypeOf({}) === Object.prototype    // true

// Object.prototype 的原型是 null
Object.getPrototypeOf(Object.prototype) === null    // true

// 函数的原型是 Function.prototype
function f() {}
Object.getPrototypeOf(f) === Function.prototype    // true

Object.setPrototypeOf()

从新指定某对象的原型对象，返回某对象。
第一参数是某对象

第二参数是新的原型对象

var a = {};
var b = {x: 1};
Object.setPrototypeOf(a, b);

Object.getPrototypeOf(a) === b    // true
a.x    // 1

将对象 a 的原型，设置为对象 b，所以 a 能够共享 b 的属性浏览器

模拟 new 建立实例

var F = function () {
    this.foo = 'bar';
};



var f = new F();

// 等同于
var f = Object.setPrototypeOf({}, F.prototype);    // 将一个空对象的原型设为构造函数的prototype属性
F.call(f);    // 将构造函数内部的this绑定这个空对象，而后执行构造函数，使得定义在this上面的方法和属性（上例是this.foo），都转移到这个空对象上

Object.create()
- 不少时候，只能拿到一个实例对象，它可能根本不是由构建函数生成的
- Object.create() 接收一个实例对象，以它为原型，再建立并返回一个实例对象。
  - ```
  // 原型对象
  var A = {
      print: function () {
          console.log('hello');
      }
  };
  
  // 实例对象
  var B = Object.create(A);
  
  Object.getPrototypeOf(B) === A    // true
  B.print()    // hello
  B.print === A.print    // true
```
  以 A 对象为原型，生成了 B 对象。B 继承了 A 的全部属性和方法函数
- 若是想要生成一个不继承任何属性（好比没有 toString() 和 valueOf() 方法）的对象，能够将Object.create() 的参数设为null
- 注意： 参数不能为空，或者不是对象，不然会报错。能够是 null
- 生成的新对象，动态继承了原型
  - 意味着在原型上添加或修改任何方法，会马上反映在新对象之上
- 还能够接受第二个参数。该参数是一个属性描述对象，它所描述的对象属性，会添加到实例对象，做为该对象自身的属性
  - ```
  var obj = Object.create({}, {
      p1: {
          value: 123,
          enumerable: true,
          configurable: true,
          writable: true,
      },
      p2: {
          value: 'abc',
          enumerable: true,
          configurable: true,
          writable: true,
      }
  });
  
  // 等同于
  var obj = Object.create({});
  obj.p1 = 123;
  obj.p2 = 'abc';
```
- Object.create() 方法生成的对象，继承了它的原型对象的构造函数
  - ```
  function A() {}
  var a = new A();
  var b = Object.create(a);
  
  b.constructor === A    // true
  b instanceof A    // true
```
  上面代码中，b 对象的原型是 a 对象，所以继承了 a 对象的构造函数this

Object.prototype.isPrototypeOf()
- 用来判断该对象是否为某对象的原型
  - ```
  var o1 = {};
  var o2 = Object.create(o1);
  var o3 = Object.create(o2);
  
  o2.isPrototypeOf(o3);    // true
  o1.isPrototypeOf(o3);    // true
```
- 只要实例对象处在参数对象的原型链上，isPrototypeOf() 方法都返回 true
- 因为Object.prototype处于原型链的最顶端，因此对各类实例都返回true，只有直接继承自 null 的对象除外

Object.prototype.__proto__ Object对象的实例对象的隐式原型对象
- 根据语言标准，__proto__属性只有浏览器才须要部署，其余环境能够没有这个属性
- 它先后的两根下划线，代表它本质是一个内部属性，不该该对使用者暴露
- 应该尽可能少用这个属性，而是用 Object.getPrototypeof() 和 Object.setPrototypeOf()，进行原型对象的读写操做
- __proto__ 属性指向当前对象的原型对象，即构造函数的 prototype 属性

获取原型对象的方法的比较
- 获取实例对象 obj 的原型对象，有三种方法
  - obj.__proto__ 只有浏览器才须要部署，其余环境能够不部署
  - obj.constructor.prototype 在手动改变原型对象时，可能会失效
    - 在改变原型对象时，通常要同时设置constructor属性
    - var P = function () {}; var p = new P(); var C = function () {}; C.prototype = p; C.prototype.constructor = C; var c = new C(); c.constructor.prototype === p // true
  - Object.getPrototypeOf(obj) 最好的方法

Object.getOwnPropertyNames()
- 返回一个数组，成员是参数对象自己的全部属性的键名（无论是否能够遍历enumerable），可是不包含继承的属性键名
- 只获取那些能够遍历的属性，使用 Object.keys(某对象) 方法

Object.prototype.hasOwnProperty()
- 用于判断某个属性是不是自身的属性，是返回 true，不然返回 false
- 是 JavaScript 之中惟一一个处理对象属性时，不会遍历原型链的方法

in 运算符
- 表示一个对象是否具备某个属性。
- 用于检查一个属性是否存在
- 它不区分该属性是对象自身的属性，仍是继承的属性
```
'length' in Date    // true
'toString' in Date    // true
```

for(...in...) 循环

得到对象的全部可遍历属性（无论是自身的仍是继承的）

var o1 = { p1: 123 };

var o2 = Object.create(o1, {
    p2: { value: "abc", enumerable: true }
});

for (p in o2) {
    console.info(p);
}
// p2    自身的属性
// p1    继承的属性

为了得到对象自身的属性，能够采用hasOwnProperty方法判断一下spa

for ( var name in object ) {
    if ( object.hasOwnProperty(name) ) {
        console.log(name);
    }
}

得到对象的全部属性（无论是自身的仍是继承的，也无论能否遍历），能够使用下面的函数

function inheritedPropertyNames(obj) {
    var props = {};
    while(obj) {
       Object.getOwnPropertyNames(obj).forEach(function(p) {
            props[p] = true;
       });
       obj = Object.getPrototypeOf(obj);    // 原型对象的原型对象
    }
    return Object.getOwnPropertyNames(props);
}

inheritedPropertyNames(Date);
// [
// "caller",
// "constructor",
// "toString",
// "UTC",
// ...
// ]prototype

对象的拷贝

若是要拷贝一个对象，须要作到下面两件事情
- 确保拷贝后的对象，与原对象具备 一样的原型
- 确保拷贝后的对象，与原对象具备 一样的实例属性

第一种方法

function copyOwnPropertiesFrom(new, old) {
    Object.getOwnPropertyNames(old).forEach(function (propKey) {
            var desc = Object.getOwnPropertyDescriptor(old, propKey);
            Object.defineProperty(new, propKey, desc);
        });
    return new;
}

function copyObject(old) {
    var new = Object.create(Object.getPrototypeOf(old));
    copyOwnPropertiesFrom(new, old);
    return new;
}

第二种更简单的写法，是利用 ES2017 才引入标准的Object.getOwnPropertyDescriptors方法

function copyObject(orig) {
    return Object.create(
        Object.getPrototypeOf(orig),
        Object.getOwnPropertyDescriptors(orig)
    );
}