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. Eclipse 保存文件时自动格式化代码

    很多同学不知道Eclipse有个很有用的功能,就是自动格式源代码的功能,一般大家都是直接Ctrl+Shift+F手动格式化,多浪费时间. 其实Eclipse里已经带有自动格式化功能了,默认是没有代开该 ...

  2. hex string 换转

    hex2string std::stringstream R; R << std::hex << 0x1254; DWORD Str2Hex(string str){ retu ...

  3. 开源项目MultiChoiceAdapter详解(二)——MultiChoiceArrayAdapter的使用

    MultiChoiceArrayAdapter其实就是可以多选的ArrayAdapter了,ArrayAdpter我们已经很熟悉了.MultiChoiceArrayAdapter这个类是抽象类,所以使 ...

  4. Java NIO Channel to Channel Transfers

    In Java NIO you can transfer data directly from one channel to another, if one of the channels is a ...

  5. ASP.NET MVC:WebPageRenderingBase.cs

    ylbtech-funcation-Utility: ASP.NET MVC:WebPageRenderingBase.cs 提供用于呈现使用 Razor 视图引擎的页的方法和属性. 1.A,WebP ...

  6. swift3.0:CoreData的使用

    一.介绍 CoreData不像slqite3那样编写代码繁琐,同时避免了使用了SQL语句的麻烦,也可以回避使用C语言的语法,降低了iOS开发的技术门槛. CoreData可降低开发成本,提高代码质量. ...

  7. N体运动的程序模拟

    这依然是与<三体>有关的一篇文章.空间中三个星体在万有引力作用下的运动被称之为三体问题,参见我的上一篇文章:三体运动的程序模拟.而这一节,对三体问题进行了扩展,实现了空间中N个星体在万有引 ...

  8. C++ 反射机制的简单实现

    C++并不支持反射机制,只能自己实现. 如果需要实现字字符串到函数到映射,一定要使用到函数指针. 简单实现反射机制,根据字符串来构造相应到类.主要有以下几点: (1) 可以使用map保存字符从到函数指 ...

  9. Asp.net WebAPi gzip压缩和json格式化

    现在webapi越来越流行了,很多时候它都用来做接口返回json格式的数据,webapi原本是根据客户端的类型动态序列化为json和xml的,但实际很多时候我们都是序列化为json的,所以webapi ...

  10. sharepoint 2010 记录管理 对象模型

    首先说一下什么是记录管理:这里有详细的说明 在 网站设置->网站集管理->网站集功能 中启用 “现场记录管理” 启用现场记录管理后在 网站管理 中多了2个功能“内容管理器设置” 和“内容管 ...