一、常见继承方式

我们日常开发中常见的继承方式主要有: 1、默认模式:

Child.prototype = new Parent();

2、借用构造函数:

function Child(a, b, c, d) {
Parent.apply(this, arguments);
}

3、借用和设置原型:

function Child(a, b, c, d) {
Parent.apply(this, arguments);
}
Child.prototype = new Parent();

4、共享原型:

Child.prototype = Parent.prototype;

5、使用临时构造函数:

var Proxy = function() {};
Proxy.prototype = Parent.prototype;
Child.prototype = new Proxy();

6、extend属性复制:

function extend(parent, child) {
child = child || {}; for(var key in parent) {
if(parent.hasOwnProperty(key)) {
child[key] = parent[key];
}
} return child;
}

当然在一些javascript库中(jQuery),还存在浅复制和深复制。 7、原型继承模式:

Object.create(Parent);

二、Object.create实现继承

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

var Parent = {
getName: function() {
return this.name;
}
} var child = Object.create(Parent, {
name: { value: "Benjamin"},
url : { value: "http://www.zuojj.com"}
}); //Outputs: Object {name: "Benjamin", url: "http://www.zuojj.com", getName: function}
console.log(child); //Outputs: Benjamin
console.log(child.getName());

我们再来看一个例子,再添加一个继承:

var Parent = {
getName: function() {
return this.name;
},
getSex: function() {
return this.sex;
}
} var Child = Object.create(Parent, {
name: { value: "Benjamin"},
url : { value: "http://www.zuojj.com"}
}); var SubChild = Object.create(Child, {
name: {value: "zuojj"},
sex : {value: "male"}
}) //Outputs: http://wwww.zuojj.com
console.log(SubChild.url); //Outputs: zuojj
console.log(SubChild.getName()); //Outputs: undefined
console.log(Child.sex); //Outputs: Benjamin
console.log(Child.getName());

通过上面可以看出Object.create()方法实现了链式继承,及原型链的继承。如果在控制台打印出各个生成的对象,可以很清楚的看到。

//Outputs: true
console.log(Child.isPrototypeOf(SubChild));
//Outputs: true
console.log(Parent.isPrototypeOf(Child));

isPrototypeOf() 方法测试一个对象是否存在于另一个对象的原型链上。 以上就是本文对Object.create方法的描述,文中不妥之处,还望批评指正。

使用Object.create()实现继承的更多相关文章

  1. 使用Object.create()实现继承 用 Object.create实现类式继承

    使用Object.create()实现继承:https://www.cnblogs.com/cuew1987/p/4075027.html 用 Object.create实现类式继承:https:// ...

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

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

  3. javascript Object.create()究竟发生了什么

      这是我在博客园的第一篇博客,早上看了一个大牛的博客,关于javascript继承的,对于大牛使用Object.create()实现继承的方式觉得点问题,就自己研究了一下,所以就有了这篇帖子. 本帖 ...

  4. js Object.create 初探

    1.作用 Object.create()方法创建一个新对象,使用现有的对象来提供新创建的对象的__proto__. https://developer.mozilla.org/zh-CN/docs/W ...

  5. 使用Object.create 克隆对象以及实现单继承

    var Plane = function () { this.blood = 100; this.attack = 1; this.defense = 1; }; var plane = new Pl ...

  6. 构造函数创建对象和Object.create()实现继承

    第一个方法用构造函数创建对象,实现方法的继承 /*创建一个对象把所有公用的属性和方法,放进去*/ function Person() { this.name = "W3cplus" ...

  7. js继承之Object.create()

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

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

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

  9. 使用 Object.create 创建对象,super 关键字,class 关键字

    ECMAScript 5 中引入了一个新方法:Object.create().可以调用这个方法来创建一个新对象.新对象的原型就是调用 create 方法时传入的第一个参数: var a = {a: 1 ...

随机推荐

  1. HDU 1251 统计难题(字典树)

    统计难题 Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 131070/65535 K (Java/Others)Total Submi ...

  2. [转]Spring 之 Log4j 的配置

  3. php错误:Uncaught exception com_exception with message Failed to create COM object

    本文为大家讲解的是php错误:Uncaught exception com_exception with message Failed to create COM object,感兴趣的同学参考下. ...

  4. Web api 访问HttpContext

    HttpContext context; Request.Properties.TryGetValue<HttpContext>("MS_HttpContext", o ...

  5. 线程的等待方法:join

    其实多线程最复杂的地方在于不同线程间的同步问题,这其中会涉及到先后执行问题.共享变量问题等.这篇文章我们主要来开个头,看一下join方法. using System; using System.Thr ...

  6. vim配置vimrc

    新建文件,自动加入文件头 修改文件,保存时,自动更新修改时间字段 自动匹配括号,引号等 vimrc文件如下 "======================================== ...

  7. 5_bootstrap之响应式布局|列表|按钮

    5.响应式工具 为针对性地在移动页面上展示和隐藏不同的内容,bootStrap提供响应式工具. 可以让开发人员通过该工具决定,在何种屏幕尺寸下,隐藏或者显示某些元素 帮助手册位置:全局CSS样式--- ...

  8. Selenium Webdriver——AutoIt和robot实现右键另存

    方案如下: 1.selenium 弹出右键菜单 2.robot选择相关菜单 3.调用autoIt实现windows gui另存操作 test case 如下: 1.打开百度(谷歌浏览器) 2.选择百度 ...

  9. c# 之 new 关键字

    1.实例化变量 DataTable dt  = new  DataTable(); 2.调用构造函数 class CoOrds { public int x, y; // 实例构造函数(默认构造函数) ...

  10. JAVA_03

    在Java中,理解JDK.JRE.JVM三者的区别是十分重要的; JDK JDK是Java Development Kit(Java开发工具包)的缩写,包含JRE和其他开发工具. JRE JRE是Ja ...