<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>constructorfunctionInherit</title>
    <script type="text/javascript">
    //声明父类
    function superClass(id){
        this.id = id;
        this.books = ['html','css','js'];
    }
    superClass.prototype.getBooks = function(){
        console.log(this.books);
    }
    //声明子类
    function subClass(id){
        superClass.call(this,id);//让子this指向父this，后面带的是父类需传入的参数id
    }
    // subClass.prototype.getSubName = function(){
    //     console.log(this.id);
    // }
    //实例化对象测试
    var test1 = new subClass(1);
    var test2 = new subClass(2);
    test2.books.push('php');//test2插入的数据'php'不影响test1

console.log(test1.id);      //1
    console.log(test1.books);   //["html", "css", "js"]
    console.log(test2.id);      //2
    console.log(test2.books);   //["html", "css", "js", "php"]
    //注：构造函数式继承是访问不到父原型链上的属性和方法的
    test1.getBooks();   //报错：undefined is not a function

//本例已经通过验证
    </script>
</head>
<body>
    
</body>
</html>

js原生设计模式——2面向对象编程之继承—call(this)构造函数式继承的更多相关文章

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

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

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

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

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

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

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

    <!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原生继承之——构造函数式继承实例

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

  9. js原生设计模式——12装饰者模式

    1.面向对象模式装饰者 <!DOCTYPE html><html lang="en"><head>    <meta charset=&q ...

随机推荐

  1. 可信执行环境（TEE）介绍

    可信执行环境(TEE)是Global Platform(GP)提出的概念.针对移动设备的开放环境,安全问题也越来越受到关注,不仅仅是终端用户,还包括服务提供者,移动运营商,以及芯片厂商.TEE是与设备 ...

  2. IE6下最小19px像素

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  3. Android--->LinearLayout页面布局方式

    main.xml布局方式 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns ...

  4. java项目开发第六天——天若有情天亦老，人间正道是沧桑

    今天讲解的东西是数据库连接,一天下来还是相对轻松的,这个组长也是够轻松的,队员加载的界面自己也是导入不了,最后也是不了了之,还是加油赶赶吧.看看严嘉那组的界面,最后就是呵呵.但是学长看完后(研究生,同 ...

  5. 使用windows上 mxnet 预编译版本

    操作系统: 64位Windows10 mxnet的Windows预编译版本:下载地址 分为不支持GPUs和支持GPUs版并,一般选择GPUs版本. 将下载的压缩包解压,比如解压到D:\mxnet.然后 ...

  6. Socket.io官方聊天室DEMO的学习笔记

    照着Socket.io官方的聊天室代码敲了一遍,遇到了一个奇怪的问题: 每次点击SEND按钮的时候,都会重新刷新页面. 在点击页面的一瞬间,看到了正在加载jquery的提示, 然后以为是jquery用 ...

  7. PAT (Advanced Level) 1003. Emergency (25)

    最短路+dfs 先找出可能在最短路上的边,这些边会构成一个DAG,然后在这个DAG上dfs一次就可以得到两个答案了. 也可以对DAG进行拓扑排序,然后DP求解. #include<iostrea ...

  8. ssh密钥登录及远程执行命令

    以192.168.1.104作为客户机 以192.168.1.103作为服务器 使用密钥登录 创建密钥对 在SSH客户机创建用户秘钥对 ssh-keygen -t rsa 之后全回车即可 将会在~/. ...

  9. struts2使用iterator标签显示嵌套Map - 云自无心水自闲 - BlogJava

    ">            <s:iterator value="dataMap.keySet()" id="class">     ...

  10. df换行问题的设置

    df是linux下用来查磁盘空间的命令,而在使用了LVM分区或网络挂载的情况下,再用df取分区的使用率时,发现有些分区显示换行了,这样会导致通过脚本取的数据不对. [root@ ]# df -h Fi ...