Object.create()详解并实现继承

男娘i 2023-02-13 11:22 14阅读 0赞

**目录**

1.简介

2.语法

3.实现单个继承

4. 继承多个

--------------------

### 1.简介 ###

Object.create()方法创建一个新对象，使用现有的对象来提供新创建的对象的\_\_proto\_\_

先举个例子

![20200528171306882.png][]

然后继续

看结果将一目了然

![2020052817165161.png][]

结论： 创建一个新对象me，使用person对象来提供新创建的对象的\_\_proto\_\_

### **2.语法** ###

>     Object.create(proto[, propertiesObject])

**参数说明**

> `proto`
> 
> 新创建对象的原型对象。
> 
> `propertiesObject`
> 
> 可选。如果没有指定为 undefind, 则是要添加到新创建对象的不可枚举（默认）属性（即其自身定义的属性，而不是其原型链上的枚举属性）对象的属性描述符以及相应的属性名称。这些属性对应[Object.defineProperties()][Object.defineProperties]的第二个参数。(可以点击去了解也是我写的)

### 3.实现单个继承 ###

最后再打印下 s1看下

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MTIyOTU4OA_size_16_color_FFFFFF_t_70][]

打印下我们的判断

console.log(s1 instanceof Student);
    console.log(s1 instanceof Person);
    console.log(s1 instanceof Object);
    // 结果 true true true

### 4. 继承多个 ###

function MyClass() {
         SuperClass.call(this);
         OtherSuperClass.call(this);
    }
    
    // 继承一个类
    MyClass.prototype = Object.create(SuperClass.prototype);
    // 混合其它
    Object.assign(MyClass.prototype, OtherSuperClass.prototype);
    // 重新指定constructor
    MyClass.prototype.constructor = MyClass;
    
    MyClass.prototype.myMethod = function() {
         // do a thing
    };

[Object.assign][] 会把  `OtherSuperClass`原型上的函数拷贝到 `MyClass`原型上，

使 MyClass 的所有实例都可用 OtherSuperClass 的方法

使用 `Object.create` 的 `propertyObject`参数 参数详情查看我的另外一篇博客

[js之Object.defineProperty和Object.defineProperties详解][Object.defineProperties]

例子

var o;
    
    // 创建一个原型为null的空对象
    o = Object.create(null);
    
    
    o = {};
    // 以字面量方式创建的空对象就相当于:
    o = Object.create(Object.prototype);
    
    
    o = Object.create(Object.prototype, {
      // foo会成为所创建对象的数据属性
      foo: { 
        writable:true,
        configurable:true,
        value: "hello" 
      },
      // bar会成为所创建对象的访问器属性
      bar: {
        configurable: false,
        get: function() { return 10 },
        set: function(value) {
          console.log("Setting `o.bar` to", value);
        }
      }
    });
    
    
    function Constructor(){}
    o = new Constructor();
    // 上面的一句就相当于:
    o = Object.create(Constructor.prototype);
    // 当然,如果在Constructor函数中有一些初始化代码,Object.create不能执行那些代码
    
    
    // 创建一个以另一个空对象为原型,且拥有一个属性p的对象
    o = Object.create({}, { p: { value: 42 } })
    
    // 省略了的属性特性默认为false,所以属性p是不可写,不可枚举,不可配置的:
    o.p = 24
    o.p
    //42
    
    o.q = 12
    for (var prop in o) {
       console.log(prop)
    }
    //"q"
    
    delete o.p
    //false
    
    //创建一个可写的,可枚举的,可配置的属性p
    o2 = Object.create({}, {
      p: {
        value: 42, 
        writable: true,
        enumerable: true,
        configurable: true 
      } 
    });

[20200528171306882.png]: https://img-blog.csdnimg.cn/20200528171306882.png
[2020052817165161.png]: https://img-blog.csdnimg.cn/2020052817165161.png
[Object.defineProperties]: https://blog.csdn.net/weixin_41229588/article/details/106400071
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MTIyOTU4OA_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200528173210446.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MTIyOTU4OA==,size_16,color_FFFFFF,t_70
[Object.assign]: https://blog.csdn.net/weixin_41229588/article/details/106406522