JavaScript基础--Object.create()

455 阅读1分钟

这个方法是ES6里新出创建新对象的方法,然而之前我们所学的方法

new Object()

var obj = {}

先搞清楚Object.create()的原理

定义

Object.create()是创建一个新的对象使用现有的对象来提供新创建对象的__proto__

参数

  • proto 创建新对象的原型对象(可以为{},或者null后面罗列)
  • propertiesObject 可选,必须是一个对象,需要添加到新对象上的可枚举属性(是添加在新对象自身的属性<不可以遍历到的属性>,而不是__proto__上的)
    • 可枚举属性
      • value ---- 值
      • writable ---- 是否可读(Boolean)默认true
      • enumerable ---- 是否可枚举(Boolean)默认false
      • configurable ---- 是否可配置(Boolean)默认true

返回值

一个带着制定原型对象和属性的 新对象

Polyfill

由于Object.create这个方法是ES6的新出的并不兼容ie8及以下

if (typeof Object.create != 'function') {
  Object.create = (function() {
    function Temp() {}
    //
    var hasOwn = Object.prototype.hasOwnProperty;


    return function (O) {
      if (typeof O != 'object') {
        throw TypeError('Object prototype may only be an Object or null');
      }
      Temp.prototype = O;
      var obj = new Temp();
      Temp.prototype = null; 
      if (arguments.length > 1) {
        var Properties = Object(arguments[1]);
        for (var prop in Properties) {
          if (hasOwn.call(Properties, prop)) {
            obj[prop] = Properties[prop];
          }
        }
      }
      return obj;
    };
  })();
}

与new Object()区别

new Object()是添加在自己的属性上,如果修改该属性是会影响到之前的对象的

var a = {  rep : 'apple' }
var b = new Object(a)
console.log(b) // {rep: "apple"}
console.log(b.__proto__) // {}
b.rep = "bananer"
console.log(a) // {  rep : 'bananer' }
console.log(b) // {  rep : 'bananer' }

Object.create()是继承自别的对象,通过原型往下寻找到该值,如果修改了该属性是不影响继承的属性的,因为会在自身添加该属性

var a = { rep: 'apple' }
var b = Object.create(a)
console.log(b)  // {}
console.log(b.__proto__) // {rep: "apple"}
b.rep = "bananer"
console.log(a) // {  rep : 'apple' }
console.log(b) // {  rep : 'bananer' }

Object.create(null)与Object.create({})

Object.create(null)是会创建一个完全纯净的对象不包含任何方法及原型 Object.create({})是会创造一个继承Object构造函数的空对象,会包含Object构造函数的方法及原型