<!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原生继承之——类式继承实例(推荐使用)的更多相关文章

  1. js原生设计模式——2面向对象编程之继承—new类式继承

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

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

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

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

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

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

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

  5. 精读JavaScript模式(八)，JS类式继承

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

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

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

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

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

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

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

  9. JS原型继承与类的继承

    我们先看JS类的继承 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> &l ...

随机推荐

  1. [转]makefile文件的编写规则及实例

    http://xueqi.iteye.com/blog/1567866   1.一个简单的makefile例子   假设一个程序有两个文件file1.c,file2.c,每个文件都包含head.h,生 ...

  2. ARM系统中函数调用过程中的参数传递-转

    在 嵌入式软件编程中,经常会用到函数调用,之前在学习如何在C语言中嵌入汇编时有了解到C语言之前的参数调用是使用寄存器R0传递第一个参数,R1传递到第 二个..一直到R3传递第四个参数.但是实际上有时可 ...

  3. Myeclipse添加struts2支持后取消操作

    Myeclipse添加struts包后, 想重新加载的方法: 1. myelicpse,右键项目,选close project 2. 找到项目所在目录, 打开.classpath删除带有struts2 ...

  4. android缓存之Lrucache 和LinkedHashMap

    两者的区别 网上有很多人使用软引用加载图片的多 ,但是现在已经不再推荐使用这种方式了,(1)因为从 Android 2.3 (API Level 9)开始,垃圾回收器会更倾向于回收持有软引用或弱引用的 ...

  5. highcharts 去掉打印和链接

    1)去掉或更改图片右下角的链接 在highcharts.js文件中搜索credits字符串,找到如下的字符串, enabled:设置是否显示链接 text:设置链接显示的名称 href:设置链接的ur ...

  6. 改变nova-compute默认位置的方法

    # cat /etc/nova/nova.conf |grep -n state_path|grep -v '#'314:state_path=/var/lib/nova

  7. 【BZOj 3670】【UOJ #5】【NOI 2014】动物园

    http://www.lydsy.com/JudgeOnline/problem.php?id=3670 http://uoj.ac/problem/5 可以建出"KMP自动机"然 ...

  8. hibernate---性能优化, 1+N问题

    session级缓存 保存一个hashmap, 读出来的对象放在里面, 如果读出来50条放50条, 如果另起session原来的50条就被清除.可以手动session.clear清除. 如果同一个se ...

  9. Spring自学教程-IOC、DI、AOP(二)

    一.spring的IOC-就是怎样使用spring来创建对象 二.springDI(依赖注入)-就是怎样给属性赋值 通过set方式赋值 以下我们只需要记住两点的赋值,基本类型和引用类型的赋值 基本类型 ...

  10. 51nod算法马拉松 contest7

    A题 链接:http://www.51nod.com/contest/problem.html#!problemId=1417 推荐链接:http://blog.csdn.net/a837199685 ...