1、实现继承:原型链
        function extend1() {//父类型
          this.name = "张三";
        }
        function extend2(){ //子类型
          this.age =18;
        }
        extend2.prototype = new extend1();//extend2继承了extend1中的属性
       (父类型的实例化对象赋值给子类型的原型属性,父类型中的构造函数和原型信息都会给extend2)
        var _extend1 = new extend2();
        console.log(_extend1.name);//张三
        console.log(_extend1.age);//18
  function extend3() {
          this.address = "重庆";
        }
        extend3.prototype = new extend2();//extend3继承了extend1和extend2
        var _extend2 = new extend3();
        console.log(_extend2.name);//张三
        console.log(_extend2.age);//18
        console.log(_extend2.address);//重庆
        
    extend1.prptotype.name = "lucy";
    var _extend1 = new extend1();
    console.log(_extend1.name);//张三  就近原则,现在实例里面找,有就返回,没有才去原型里面找
   子类型从属于自己或他的超类型(父类型)
    alert(_extend2.instanceof Object);//true 
    alert(_extend2.instanceof extend2);//true 
    alert(_extend2.instanceof extend1);//true 
2、组合继承
  function Group1(age) {
          this.name = ["Linda",'Bob','Lucy','Anna'];
          this.age = 25;
        }
 构造函数里的方法放在构造里每次实例化都会分配一个内存地址(浪费),放在原型里保证每次实例化都只有一个引用地址:
        Group1.prototype.run = function () {
          return this.name + ',' + this.age;
        }
        function Group2(age) {
          Group1.call(this,age);//对象冒充只能继承构造实例中的,不能继承原型中的信息
        }
        Group2.prototype = new Group1();//原型链继承,否则原型里的run方法是访问不到的
        var _group1 = new Group2(20);
        console.log(_group1.run());

3、原型式继承
1. 临时中转函数
  function obj (o) {//o表示杨要穿ID进的一个对象
     function F(){};//F构造函数是一个临时新建的对象,用于存储传过来的对象
     F.prototype = o; //jiango对象实例赋值给F构造函数的原型对象
     return new F(); //返回这个得到传递过来对象的对象实例
  }
2. 字面量的声明方式(相当于 var box = new Box();)
 var box= {
   name:"Lucy",
   age :100
 }
F.prototype = 0;//
 var box1 = obj(box);box1就等于 new F();
 alert(box1.name);//lucy
4、寄生式继承=原型式+工厂模式
1. 临时中转函数
  function obj (o) {//o表示杨要穿ID进的一个对象
     function F(){};//F构造函数是一个临时新建的对象,用于存储传过来的对象
     F.prototype = o; //jiango对象实例赋值给F构造函数的原型对象
     return new F(); //返回这个得到传递过来对象的对象实例
  }
//寄生函数
function create(o){
   var f = obj(o);
   f.run = function(){
     return this.name + "方法";
   }
   return f;
}
 var box= {
   name:"Lucy",
   age :100
 }
var box1 = create(box);
alert(box1.run());//lucy方法
5、寄生式组合继承(最终完美版本)
1. 临时中转函数
  function obj (o) {//o表示杨要穿ID进的一个对象
     function F(){};//F构造函数是一个临时新建的对象,用于存储传过来的对象
     F.prototype = o; //jiango对象实例赋值给F构造函数的原型对象
     return new F(); //返回这个得到传递过来对象的对象实例
  }
2.寄生函数
  function create(box,desk){
   var f = obj(box.prototype);
   desk.prototype = f;
   return f;
}
3.构造函数
function Box(name,age){
  this.name = name;
  this.age = age;
]
4.原型式方法
Box.prototypr.run = function(){
    return this.name + this.age + "运行中..."
 }
5.对象冒充
function Desk(name,age){
   Box.call(this,name,age);
 }
6.通过寄生组合继承来实现继承
create(Box,Desk);//用于替代 Desk.prototype = new Box();

js基础——继承的更多相关文章

  1. 【 js 基础 】Javascript “继承”

    是时候写一写 "继承"了,为什么加引号,因为当你阅读完这篇文章,你会知道,说是 继承 其实是不准确的. 一.类1.传统的面向类的语言中的类:类/继承 描述了一种代码的组织结构形式. ...

  2. 【 js 基础 】【读书笔记】Javascript “继承”

    是时候写一写 “继承”了,为什么加引号,因为当你阅读完这篇文章,你会知道,说是 继承 其实是不准确的. 一.类1.传统的面向类的语言中的类:类/继承 描述了一种代码的组织结构形式.举个例子:“汽车”可 ...

  3. JS基础-全方面掌握继承

    前言 上篇文章详细解析了原型.原型链的相关知识点,这篇文章讲的是和原型链有密切关联的继承,它是前端基础中很重要的一个知识点,它对于代码复用来说非常有用,本篇将详细解析JS中的各种继承方式和优缺点进行, ...

  4. 基础3:js实现继承的多种方式

    js实现继承的多种方式 1. 原型链继承 function Parent() { this.name = 'xwk' } Parent.prototype.getName = function() { ...

  5. js基础篇——call/apply、arguments、undefined/null

    a.call和apply方法详解 call方法: 语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象 ...

  6. AJAX学习前奏----JS基础加强

     AJAX学习前奏----JS基础加强 知识概要: 1.js类&属性&方法的定义 2.静态属性与方法 3.构造方法 4.原型的使用 5.Object对象直接加属性和方法 6.JSO ...

  7. js基础--javaScript数据类型你都弄明白了吗?绝对干货

    欢迎访问我的个人博客:http://www.xiaolongwu.cn 数据类型的分类 JavaScript的数据类型分为两大类,基本数据类型和复杂数据类型. 基本数据类型:Null.Undefine ...

  8. JS基础学习1

    1 JS 概述 一个完整的javascript实现是由以下3个不同部分组成的: (1)     核心(ECMAscript) (2)     文档对象模型(DOM)  Document object ...

  9. 前端面试题目汇总摘录(JS 基础篇)

    JS 基础 JavaScript 的 typeof 返回那些数据类型 object number function boolean undefined string typeof null; // o ...

随机推荐

  1. 自定义View系列教程01--常用工具介绍

    站在源码的肩膀上全解Scroller工作机制 Android多分辨率适配框架(1)- 核心基础 Android多分辨率适配框架(2)- 原理剖析 Android多分辨率适配框架(3)- 使用指南 自定 ...

  2. CSS user-select文本是否可复制

    1. 概述 1.1 说明 在项目过程中,有时候需要网页中内容信息不可被复制进行保护数据信息,故可使用css属性user-select进行控制用户能否选中文本. 1.2 语法 user-select : ...

  3. iOS9新系统下App Store应用上传新指南

    http://www.cocoachina.com/appstore/20151010/13691.html 最近频繁收到小伙伴们的反馈,说经过前期学习已对ASO规则略有了解,但APP的提交审核是由技 ...

  4. 设置onselectstart在ie浏览器下对于input及textarea标签页会生效

    设置onselectstart在ie浏览器下对于input及textarea标签页会生效, 可以使用js来控制对于某种标签不生效,代码如下: document.onselectstart = disa ...

  5. nginx 做反向代理

    1.Nginx的常用配置大家可以去搜一下,有很多优秀的博客,我这篇文章要实现的需求是: a.根据访问的域名不同,跳转到不同的项目(html首页,80端口) b.拦截访问中所有带有api的请求,转发到后 ...

  6. Java面向对象----多态概念,对象上下转型

    概念:同一操作作用于某一类对象,可以有不同的解释,产生不同的执行结果 多态存在的三个必要条件 需要存在继承和实现关系 同样的 方法调用而执行不同操作,运行不同的代码(重写操作) 在运行时父类或者接口的 ...

  7. @atcoder - CODE FESTIVAL 2017 Final - J@ Tree MST

    目录 @description@ @solution@ @accepted code@ @details@ @description@ 给定 N 个点,第 i 点有一个点权 Xi,再给定一棵边带权的树 ...

  8. 10-2 body标签中相关的标签(字体标签,排版标签(div,span),超链接,图片标签)

    一 排版标签(div,span) 1块级标签 <!--div:把标签中的内容作为一个块儿来对待(division).必须单独占据一行.--> <!--div标签的属性:--> ...

  9. 公司安装mariaDB-5.5.52和Jdk 7

    转自:http://www.cnblogs.com/kgdxpr/p/3209009.html vi /etc/yum.repos.d/MariaDB.repo 加入下面内容 [mariabd]nam ...

  10. Jmeter监控

    https://www.cnblogs.com/saryli/p/6596647.html JMeter是一款压力测试工具,我们也可以用它来监控服务器资源使用情况. JMeter正常自带可以通过Tom ...