1、作用

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

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/create

2、Object.create内部实现

Object.create =  function (o) {

    var F = function () {};

    F.prototype = o;

    return new F();

};

Object.create是内部定义一个对象，并且让F.prototype对象 赋值为引进的对象/函数 o，并return出一个新的对象。

3、使用Object.create实现继承

说明：以下示例使用Object.create创建的对象obj，obj只有父类的prototye上的属性和方法。不具有父类示例上的方法。

<!DOCTYPE html>

<html lang="zh">

    <head>

        <meta charset="UTF-8" />

        <meta name="viewport" content="width=device-width, initial-scale=1.0" />

        <meta http-equiv="X-UA-Compatible" content="ie=edge" />

        <title>使用Object.create实现继承</title>

    </head>

    <body>

        <script src="https://cdn.bootcss.com/lodash.js/4.17.10/lodash.min.js"></script>

        <script type="text/javascript">

            var Base = function() {

                //实例属性

                this.a = 2

            }

            //原型属性

            Base.prototype.a = 3;

            //原型方法

            Base.prototype.sayA = function() {

                return this.a

            };

            //创建实例o1

            var o1 = new Base();

            //创建实例o2

            var o2 = Object.create(Base.prototype);

            console.log(o1)

            console.log(o2)

            //打印实例

            console.log(o1.a); //2

            console.log(o2.a); //3

            console.log(o1.sayA()); //2

            console.log(o2.sayA()); //3

            console.log(o1 instanceof Base); //true

            console.log(o2 instanceof Base); //true

        </script>

    </body>

</html>
Object.create还有第二个参数：
Object.create(proto, [propertiesObject])

propertiesObject可选。如果没有指定为 undefined，则是要添加到新创建对象的可枚举属性（即其自身定义的属性，而不是其原型链上的枚举属性）对象的属性描述符以及相应的属性名称。这些属性对应Object.defineProperties()的第二个参数。

强调：是自身的属性，而不是原型链上的属性。

同时，默认是不可枚举的。

const obj = Object.create({}, {p: {value: 42}});

Object.values(obj) // []

若设置为枚举的话：

const obj = Object.create({}, {p:

  {

    value: 42,

    enumerable: true

  }

});

Object.values(obj) // [42]
 

4、new做了什么操作

var obj  = {};

obj.__proto__ = Base.prototype;

Base.call(obj);

总结来说：obj的__proto__指向父类的原型对象，因此可以访问父类原型对象上的方法。将父类的this指向obj，因此obj可以访问父类实例上的方法和属性。

更新：2019.1.3

function New2(func){

                let obj = Object.create(func.prototype)

                let k = func.call(obj)//this指向obj

                if (typeof k == 'object') {

                    return k

                } else{

                    return obj

                }

            }

5、继承说明

sub.prototype = new Super()

因为prototype是一个对象，所以让它等于一个对象，而不是Super方法。

js Object.create 初探的更多相关文章

  1. JS - Object.create(prototype)方法

    用Object.create(prototype)方法创建一个对象,这个对象的原型将指向这个传入的prototype参数

  2. 【前端】js中new和Object.create()的区别

    js中new和Object.create()的区别 var Parent = function (id) { this.id = id this.classname = 'Parent' } Pare ...

  3. [JS] Topic - Object.create vs new

    故事背景 Ref: 你不知道的javascript之Object.create 和new区别 var Base = function () {} (1) var o1 = new Base(); (2 ...

  4. js中的new操作符与Object.create()的作用与区别

    js中的new操作符与Object.create()的作用与区别 https://blog.csdn.net/mht1829/article/details/76785231 2017年08月06日 ...

  5. js继承之Object.create()

    通过 Object.create() 方法,使用一个指定的原型对象和一个额外的属性对象创建一个新对象.这是一个用于对象创建.继承和重用的强大的新接口.说直白点,就是一个新的对象可以继承一个对象的属性, ...

  6. js创建对象 object.create()用法

    Object.create()方法是ECMAScript 5中新增的方法,这个方法用于创建一个新对象.被创建的对象继承另一个对象的原型,在创建新对象时可以指定一些属性. 语法: Object.crea ...

  7. js学习日记-new Object和Object.create到底干了啥

    function Car () { this.color = "red"; } Car.prototype.sayHi=function(){ console.log('你好') ...

  8. 使用 Object.create实现js 继承

    二.Object.create实现继承 本文将来学习第七种继承方式Object.create()方法来实现继承,关于此方法的详细描述,请戳这里.下面来通过几个实例来学习该方法的使用: var Pare ...

  9. js 继承,Object.setPrototypeOf | Object.getPrototypeOf | Object.create class

    https://juejin.im/post/5cfd9d30f265da1b94213d28#heading-14 https://juejin.im/post/5d124a12f265da1b91 ...

随机推荐

  1. 如何在 Xcode 中修改应用的名字

    找到 TARGETS 中的 Build Setting ,下拉找到 Packaging ,修改 Product Name 即可.

  2. 都市侠盗第一季/全集Leverage迅雷下载

    第一季 Leverage Season 1 (2008)看点:Nate Ford(蒂莫西·赫顿 Timothy Hutton 饰)曾当过保险调查员,为自己的老板挽回过数百万美元的损失,是个忠心耿耿的雇 ...

  3. Universal-Image-Loader解析（三）——用ListView和ViewPager加载网络中的图片

           现在我们终于可以通过这个框架来实现ListView中加载图片了,至于ViewPager还是别的,原理其实都是一样的 一.ListView 1.布局文件 list_layout.xml & ...

  4. 摩拜单车模式优于OFO双向通信才能被认可

    马化腾 :摩拜单车模式优于OFO双向通信才能被认可 2017-06-20 00:12 最近共享单车里最头条的新闻是 悟空单车宣布退出竞争,并全部退还投资款和押金以及余额.运营才5个月,成为第一家倒下的 ...

  5. 微服务中的 API 网关（API Gateway）

    API 网关(API Gateway)提供高性能.高可用的 API 托管服务,帮助用户对外开放其部署在 ECS.容器服务等云产品上的应用,提供完整的 API 发布.管理.维护生命周期管理.用户只需进行 ...

  6. Apache Jmeter 教程

    Jmeter是一款优秀的开源测试工具, 是每个资深测试工程师,必须掌握的测试工具,熟练使用Jmeter能大大提高工作效率. 熟练使用Jmeter后, 能用Jmeter搞定的事情,你就不会使用LoadR ...

  7. [转]在ubuntu linux下以编译方式安装LAMP(apache mysql php)环境

    FROM : http://www.cnblogs.com/eleganthqy/archive/2010/02/28/1675217.html 最近转向到了使用ubuntu做桌面,安装好系统以来一直 ...

  8. JAVA中String.format的用法 格式化字符串,格式化数字,日期时间格式化,

    1.对整数进行格式化:%[index$][标识][最小宽度]转换方式        我们可以看到,格式化字符串由4部分组成,其中%[index$]的含义我们上面已经讲过,[最小宽度]的含义也很好理解, ...

  9. Java工程Properties配置文件注释中文,会自动转换为其他编码方式问题解决 中文乱码

    properties文件中想注释中文,但是写出来后却是 :# /4djf/234/4354/r23df/324d  这种效果 是因为字符编码默认没有设置造成的,以前总是安装插件解决此问题, 但是却牺牲 ...

  10. iOS：调节系统的亮度

    一.简单介绍 亮度是UIScreen的一个浮点型属性,而UIScreen是一个单例,所以这个亮度是全局的,任何一个地方改动,整个手机的亮度都会改变.这个亮度在iOS5.0后被苹果开放,开发者可以很方便 ...