<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>classInherit</title>
    <script type="text/javascript">
    //声明父类
    function superClass(){
        this.name = 'Lucy';
    }
    superClass.prototype.getName = function(){
        console.log(this.name);
    }
    //声明子类
    function subClass(){
        this.subname = 'Lilei';
        this.books = ['html','css','js'];
    }
    //类式继承
    subClass.prototype = new superClass();
    //注：一定要先继承，再添加子类原型方法，否则子类的实例调用子类原型方法时会报错：function is not defined
    subClass.prototype.getSubName = function(){
        console.log(this.subname);
    }
    //将子类的prototype原型constructor属性的指向修正为subClass子类，否则继承后默认指向了父类的原型上，会出问题
    subClass.prototype.constructor = subClass;
    //实例化对象测试
    var test1 = new subClass();
    var test2 = new subClass();
    console.log(test1.name);       //Lucy
    console.log(test1.subname);    //Lilei
    test1.getName();               //Lucy
    test1.getSubName();            //Lilei
    // console.log(test1.books);
    test1.books.push('php');
    console.log(test1.books);   //输出：["html", "css", "js", "php"]
    console.log(test2.books);   //输出：["html", "css", "js"]
                                // 两个实例之间不会影响
    //本例已经通过验证
    </script>
</head>
<body>
    
</body>
</html>

js原生设计模式——2面向对象编程之继承—new类式继承的更多相关文章

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

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

  2. js原生设计模式——2面向对象编程之继承—new+call(this)组合式继承

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

  3. js原生设计模式——2面向对象编程之继承—多继承

    1.单对象克隆 <!DOCTYPE html><html lang="en"><head>    <meta charset=" ...

  4. js原生设计模式——2面向对象编程之继承—call(this)构造函数式继承

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

  5. js原生设计模式——2面向对象编程之js原生的链式调用

    技巧点:对象方法中返回当前对象就可以链式调用了,即方法中写return this; <!DOCTYPE html><html lang="en"><h ...

  6. js原生设计模式——2面向对象编程之闭包2

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

  7. js原生设计模式——2面向对象编程之闭包1

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

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

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

  9. js原生继承之——类式继承实例(推荐使用)

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

随机推荐

  1. OpenGL学习--------动画制作

    假设某动画一共有n幅画面,则它的工作步骤就是:显示第1幅画面,然后等待一小段时间,直到下一个1/24秒显示第2幅画面,然后等待一小段时间,直到下一个1/24秒……显示第n幅画面,然后等待一小段时间,直 ...

  2. 利用ZjDroid对 <捕鱼达人3> 脱壳及破解过程-转

    http://blog.sina.com.cn/zihao2015 <捕鱼达人3> 刚出来不久,就被鬼哥Dump出来dex,随之破解也就轻而易举.一开始我用ZjDroid神器试验过,但是没 ...

  3. linux下sed命令对文件执行文本替换

    让我们看一下 sed 最有用的命令之一,替换命令.使用该命令,可以将特定字符串或匹配的规则表达式用另一个字符串替换.下面是该命令最基本用法的示例: $ sed -e ‘s/foo/bar/’ myfi ...

  4. （转）StringTokenizer类的使用

    StringTokenizer是一个用来分隔String的应用类,相当于VB的split函数.1.构造函数public StringTokenizer(String str)public String ...

  5. Material Design设计的开源代码

    https://github.com/telly/FloatingAction http://www.csdn.net/article/2014-11-21/2822753-material-desi ...

  6. CvvImage类

    从OpenCV 2.2.0开始,OpenCV取消了CvvImage这个类.可是今天要用到,可以自己加入到工程中. 首先,找到CvvImage的原代码.我在网上已经找到了,具体代码如下. 这是CvvIm ...

  7. STM32开发指南-DMA

    DMA,直接存储器访问.传输数据时,外设通过DMA控制器直接访问内存,不经过cpu直接控制传输数据.不需要像中断处理方式需要保留和恢复现场的过程.通过硬件为内存和I/O设备开辟一条直接传送数据的通道, ...

  8. Transport layer and Network layer

    http://stackoverflow.com/questions/13333794/networking-difference-between-transport-layer-and-networ ...

  9. POJ 3449 Geometric Shapes

    判断两个多边形是否相交,只需判断边是否有相交. 编码量有点大,不过思路挺简单的. #include<cstdio> #include<cstring> #include< ...

  10. ASP.NET Security

    <authentication mode="Forms"> <forms loginUrl="~/Account/Login" timeout ...