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

用 Object.create实现类式继承:https://www.jianshu.com/p/561432a109d6

一、常见继承方式

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

1
Child.prototype = new Parent();

2、借用构造函数:

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

3、借用和设置原型:

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

4、共享原型:

1
Child.prototype = Parent.prototype;

5、使用临时构造函数:

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

6、extend属性复制:

1
2
3
4
5
6
7
8
9
10
11
function extend(parent, child) {
    child = child || {};
 
    for(var key in parent) {
        if(parent.hasOwnProperty(key)) {
            child[key] = parent[key];
        }
    }
 
    return child;
}

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

1
Object.create(Parent);

二、Object.create实现继承

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
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());

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
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()方法实现了链式继承,及原型链的继承。如果在控制台打印出各个生成的对象,可以很清楚的看到。

1
2
3
4
//Outputs: true
console.log(Child.isPrototypeOf(SubChild));
//Outputs: true
console.log(Parent.isPrototypeOf(Child));

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

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

  1. js原生设计模式——2面向对象编程之继承—原型继承(类式继承的封装)

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  2. 精读JavaScript模式(八),JS类式继承

    一.前言 这篇开始主要介绍代码复用模式(原书中的第六章),任何一位有理想的开发者都不愿意将同样的逻辑代码重写多次,复用也是提升自己开发能力中重要的一环,所以本篇也将从“继承”开始,聊聊开发中的各种代码 ...

  3. JS原型继承和类式继承

    前言 一个多月前,卤煮读了一篇翻译过来的外国人写的技术博客.此君在博客中将js中的类(构造)继承和原型继承做了一些比较,并且得出了结论:建议诸位在开发是用原型继承.文中提到了各种原型继承的优点,详细的 ...

  4. JavaScript 类式继承与原型继承

    交叉着写Java和Javascript都有2年多了,今天来总结下自己所了解的Javascript类与继承. Javascript本身没有类似Java的面向对象的类与继承术语,但其基于原型对象的思想却可 ...

  5. JavaScript中的类式继承和原型式继承

    最近在看<JavaScript设计模式>这本书,虽然内容比较晦涩,但是细品才发现此书内容的强大.刚看完第四章--继承,来做下笔记. 书中介绍了三种继承方式,类式继承.原型式继承和掺元类继承 ...

  6. javascript类式继承函数最优版

    直接上代码: klass函数 var klass = function (Parent, props) { var Child, F, i; //1.新构造函数 Child = function () ...

  7. js类式继承模式学习心得

    最近在学习<JavaScript模式>,感觉里面的5种继承模式写的很好,值得和大家分享. 类式继承模式#1--原型继承 方法 让子函数的原型来继承父函数实例出来的对象 <script ...

  8. JS面向对象组件 -- 继承的其他方式(类式继承、原型继承)

    继承的其他形式: •类式继承:利用构造函数(类)继承的方式 •原型继承:借助原型来实现对象继承对象   类 : JS是没有类的概念的 , 把JS中的构造函数看做的类 要做属性和方法继承的时候,要分开继 ...

  9. js面向对象--类式继承

    //待研究//类式继承 //js中模拟类式继承的3个函数 //简单的辅助函数,让你可以将新函数绑定到对象的 prototype 上 Function.prototype.method = functi ...

随机推荐

  1. JAVA笔记27-正则表达式(RegularExpressions)

    正则表达式是字符串的处理利器. 用途:字符串匹配(字符匹配).字符串查找.字符串替换 例如:IP地址是否正确.从网页中揪出email地址(如垃圾邮件).从网页中揪出链接等 涉及到的类:java.lan ...

  2. 【NOIP2016提高A组模拟9.17】序列

    题目 分析 首先用\(a_i\)表示达到目标的步数\(B_i-A_i(mod 4)\) 根据粉刷栅栏,先不管mod 4的情况,答案就是\(\sum\max(a_i-a_{i+1},0)\) 那我们刚才 ...

  3. JS收缩展开效果

    // 收缩展开效果 $(document).ready(function () { $(".box h2").toggle(function () { $(this).next(& ...

  4. 21.栈的压入、弹出序列(python)

    题目描述 输入两个整数序列,第一个序列表示栈的压入顺序,请判断第二个序列是否可能为该栈的弹出顺序.假设压入栈的所有数字均不相等.例如序列1,2,3,4,5是某栈的压入顺序,序列4,5,3,2,1是该压 ...

  5. 利用aspose-words直接将Word转化为图片

    之前遇到一个需求,需要在word文档中加入一些文字,并转化为图片.之前也试过几种方案,但是发现效果还不是很理想,且中间需要经过一次转化为pdf的过程,最近找到了最理想的方式,即利用aspose-wor ...

  6. linux-PXE-12

    以DHCP+DNS模式管理服务器IP地址和主机名.服务器上架前,以其MAC地址为依据,在DHCP中配置主机保留并分配主机名.DHCP结合TFTP提供的PXE服务,提供PXE引导Linux内核和启动镜像 ...

  7. 从源码编译安装PCL并运行第一个小例子

    如何通过源码编译方式安装PCL 对于很多想学习PCL的同学而言,往往会被如何安装困扰很长时间.我就是这其中的一员,为了不让大家在安装问题上浪费太多时间,我决心写下这篇小小的随笔,希望对大家有所帮助. ...

  8. 8.并发编程--多线程通信-wait-notify-模拟Queue

    并发编程--多线程通信-wait-notify-模拟Queue 1. BlockingQueue 顾名思义,首先是一个队列,其次支持阻塞的机制:阻塞放入和获取队列中的数据. 如何实现这样一个队列: 要 ...

  9. 20175221 《Java程序设计》第10周学习总结

    20175221   <Java程序设计>第10周学习总结 教材学习内容总结 第十二章主要内容有: 进程与线程 进程是程序的一次动态执行过程,它对应了从代码加载.执行至执行完毕的一个完整过 ...

  10. Hook CreateProcess

    6种比较常用的运行(执行)程序的方法: 包括WinExec.ShellExecute.CreateProcess.CreateProcessAsUser.CreateProcessWithLogonW ...