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. 如何合并两个git commit

    把你的修改stage之后运行: git rebase -i HEAD~2 然后把第二行的pick改成squash就ok啦 note: 同理,如果要合并多个commit,把后面的2改成你想要合并的com ...

  2. CSS基础学习中的几大要点心得

    CSS是前端学习中较为简单但又非常复杂的课程,说简单是因为学习它并不需要太多推理论证和逻辑思维,说它非常复杂则是更多的侧重在它的“杂”上,因为太多的格式和套路需要我们注意.以下谨列出本人在CSS学习中 ...

  3. Bellman-Ford(可解决负权边)--时间复杂度优化

    Bellman-Ford 可解决带有负权边的最短路问题 解决负权边和Dijkstra相比是一个优点,Bellman-Ford的核心代码只有4行:: u[],v[],w[] 分别存一条边的顶点.权值,d ...

  4. @bzoj - 4951@ [Wf2017]Money for Nothing

    目录 @description@ @solution@ @accepted code@ @details@ @description@ 在这道题种你需要解决一个全世界人类从存在起就在面临的最深刻的问题 ...

  5. Codeforces 414B

    题目链接 附上代码: #include<cstdio> #include<cstring> #include<bits/stdc++.h> #define mod ...

  6. 开通了第一个博客,mark一下!

    今日上网查询了不同的博客,包括csdn.掘金等,最终决定选择博客园.打算待前端学完后,自己建立一个博客,这段时间内先用博客园记录学习过程.经常总结.更新,相信坚持学习一定可以找到好工作!

  7. KiCad EDA 过孔是否可以开窗?

    KiCad EDA 过孔是否可以开窗? 和传统的商业 EDA 不同,KiCad EDA 的过孔默认就是盖绿油. 在 KiCad 的过孔界面没有任何可以设置的地方,这也有一个好处,不过考虑过孔是否盖油. ...

  8. Flutter SDK path为空导致工程打开后不显示iOS模拟器的问题

    说明下问题场景,面向git编程时下载了个开源的Flutter项目 Mac系统下AndroidStudio打开工程后,发现顶部不展示iPhone模拟器 根据ide浅黄色提示提示,判断是FlutterSD ...

  9. 2019-3-21-win10-uwp-修改图片质量压缩图片

    title author date CreateTime categories win10 uwp 修改图片质量压缩图片 lindexi 2019-03-21 15:29:20 +0800 2019- ...

  10. Libevent:5events相关

    Libevents的基本操作单元是event,每一个event代表了一些条件的集合,这些条件包括: 文件描述符已经准备好读或写 文件描述符正在变为就绪,准备好读或写(仅限于边沿触发) 超时事件 信号发 ...