javascript继承一般有三种模式:组合继承,原型式继承和寄生式继承;

1组合继承:javascript最为广泛的继承方式通过原型链实现对原型属性和方法的继承,通过构造函数实现对实例属性的继承,同时发挥两者的优越性。

<script>
function supertype(name){//父类型的构造函数
        	this.name=name;
        	this.colors=["blue","yellow","red"];
        }
        supertype.prototype.sayname=function(){//父类型的原型
        	alert(this.name);
        }
        function subtype(name){
        	   supertype.call(this,name);//通过call函数实现了向父类型的构造函数中传参
        	   this.age=13;
        }
        subtype.prototype=new supertype();//通过原型链继承了supertype实例中的所有属性和方法
        var instance1=new subtype("彭湖湾");

        alert(instance1.name);//输出彭湖湾
        instance1.colors.push("black");
        alert(instance1.colors);//输出为blue,yellow,red,black

        var instance2=new subtype("小明");
        alert(instance2.name);//输出为小明
        alert(instance2.colors);//输出为blue,yellow,red
</script>

  

在组合继承的过程中,首先调用了call()函数继承了父类型的构造函数的所有属性(又叫做伪继承),这样做有两个好处

1:克服了纯粹只使用原型链继承不能直接传参的缺陷,比如上面subtype继承supertype后能够在创建实例时传入自己的name参数,如果单纯使用原型式继承则不能做到这一点。

2:如果只使用原型链进行继承,实例中的引用类型的属性比如Array,Date,Function等属性是共用的,使用时将非常麻烦。但组合继承中由于通过call()方法继承了父类型的构造函数,新添加的属性将覆盖掉原本共用的引用类型属性。举个例子,在上面的代码中instance1.colors和instance2.colors输出分别为blue,yellow,red,black和blue,yellow,red,在两个实例中colors数组属性是相互独立的,但如果去掉

supertype.call(this,name);//通过call函数实现了向父类型的构造函数中传参
this.age=13;

这一段代码的话,实例的colors属性的输出结果将变成:

        instance1.colors.push("black");
        alert(instance1.colors);//输出为blue,yellow,red,black

        var instance2=new subtype("小明");
        alert(instance2.colors);//输出为blue,yellow,red,black

  

instance1对colors数组属性添加“Black”的操作同时对instance2的的属性造成了影响,这表明,如果只使用原型链继承的话,colors属性是子类型的实例所共用的

二:原型式继承:仅借助原型基于已有的对象创建新的副本对象

<script>
function object(o){//o为一个以对象字面量形式定义的对象
        function new_object(){};//通过构造函数形式创建一个新对象
        new_object.prototype=o;//使新对象的原型等于传入的对象
        return new new_object();//返回新对象的实例
   }
   var person={//创建一个person对象
       name:"彭湖湾",
       age:,
       friends:["a","b","c"]
   };
   var person1=object(person);//根据person对象创建一个实例person1
   person1.name="小明";
   person1.friends.push("d");
   alert(person1.name);//输出为小明
   alert(person1.friends);//输出为a,b,c,d
   var person2=object(person);//根据person对象创建一个实例person2
   alert(person2.name);//输出为彭湖湾
   alert(person2.friends);//输出为a,b,c,d
</script>

基本的思想和工厂模式相类似,声明一个以一个字面量对象为参数的函数,并将其作为新对象的原型,最后将新对象的实例返回

原型式继承的优点:能实现函数复用,能创建大量相似的对象

原型式继承的缺点:正如上文所说:在原型式继承中,在创建子类型实例时,子类型实例的基本类型属性(如boolean,number,string)可以分别指定不同的新值,但引用类型(Array,Date,Function,Object)的属性则在各个子类型实例中是共享的

三.寄生式继承:和原型式继承类似,但在函数内部通过某些方式来增强对象:

<script>
unction createanother(o){
         var new_object=Object(o);//通过调用函数复制一个副本对象
         new_object.sayhi=function(){//以某种方式来增强这个对象
             alert("hi");
         }
         return new_object;//返回该副本对象
     }
     var person={//创建一个person对象
         job:"student"
     }
     var person2=createanother(person);
     person2.sayhi();
</script>

javascript继承的三种模式的更多相关文章

  1. JavaScript 继承的几种模式

    /** * Created by 2016 on 2016/6/5. */ //1.原型链继承 //把子类的原型,定义为超类的实例 通过原型来访问超类的方法和属性 function Person(){ ...

  2. JavaScript继承的几种模式

    原型链 让一个类的原型对象指向另一个类的实例

  3. JavaScript中创建对象的三种模式

    JS中,便于批量创建对象的三种模式: 1.工厂模式:用一个函数封装创建对象的细节,传入必要的参数,在函数内部new一个对象并返回. 缺点:创建的对象无法识别类型(全是Object) 2.构造函数模式: ...

  4. JS面向对象(3) -- Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法

    相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...

  5. hadoop学习;自己定义Input/OutputFormat;类引用mapreduce.mapper;三种模式

    hadoop切割与读取输入文件的方式被定义在InputFormat接口的一个实现中.TextInputFormat是默认的实现,当你想要一次获取一行内容作为输入数据时又没有确定的键.从TextInpu ...

  6. JS学习笔记——JavaScript继承的6种方法(原型链、借用构造函数、组合、原型式、寄生式、寄生组合式)

    JavaScript继承的6种方法 1,原型链继承 2,借用构造函数继承 3,组合继承(原型+借用构造) 4,原型式继承 5,寄生式继承 6,寄生组合式继承 1.原型链继承. <script t ...

  7. .net core 注入中的三种模式:Singleton、Scoped 和 Transient

    从上篇内容不如题的文章<.net core 并发下的线程安全问题>扩展认识.net core注入中的三种模式:Singleton.Scoped 和 Transient 我们都知道在 Sta ...

  8. Javascript 创建对象的三种方法及比较【转载+整理】

    https://developer.mozilla.org/zh-CN/docs/JavaScript/Guide/Inheritance_and_the_prototype_chain 本文内容 引 ...

  9. android中MVC,MVP和MVVM三种模式详解析

    我们都知道,Android本身就采用了MVC模式,model层数据源层我们就不说了,至于view层即通过xml来体现,而 controller层的角色一般是由activity来担当的.虽然我们项目用到 ...

随机推荐

  1. AndroidTips-052:.aar文件依赖

    aar aar 文件是android 类库项目的输出文件,其中可以包含普通的.class,清单,以及android项目特有的资源文件. 使用方式 将.aar文件放在在自己项目的libs目录下 在gra ...

  2. 在Ubuntu下搭建ASP.NET 5开发环境

    在Ubuntu下搭建ASP.NET 5开发环境 0x00 写在前面的废话 年底这段时间实在太忙了,各种事情都凑在这个时候,没时间去学习自己感兴趣的东西,所以博客也好就没写了.最近工作上有个小功能要做成 ...

  3. clr 元数据

    clr相关编译器编译生成的托管模块由四部分组成:PE32或32+头.clr头.元数据.IL代码. 元数据和IL代码完全对应,保持一致(:>)性. 元数据有很多用途: VS的智能感知,自动补全: ...

  4. Linux常用指令指南,终端装逼利器

    最近搞了台Macbook Pro,就学习了一下Linux命令,在网上查了些资料,看了本书叫<快乐的 Linux 命令行>,里面涉及到了各个方面的命令. 在此将常用的整理出来,以备将来使用. ...

  5. 餐饮连锁公司IT信息化解决方案一

             从餐饮企业的信息化需求来说,没有哪一种解决方案能满足所有餐饮企业的信息化建设需要.不同的餐饮业态有不同的业务流程,不同业态的信息化解决方案是目前餐饮企业信息化建设急需的,这种一站式整 ...

  6. javascript高性能编程-算法和流程控制

          代码整体结构是执行速度的决定因素之一. 代码量少不一定运行速度快, 代码量多也不一定运行速度慢. 性能损失与代码组织方式和具体问题解决办法直接相关.       倒序循环可以提高性能,如: ...

  7. Android之数据存储的五种方法

    1.Android数据存储的五种方法 (1)SharedPreferences数据存储 详情介绍:http://www.cnblogs.com/zhangmiao14/p/6201900.html 优 ...

  8. docker4dotnet #2 容器化主机

    .NET 猿自从认识了小鲸鱼,感觉功力大增.上篇<docker4dotnet #1 前世今生&世界你好>中给大家介绍了如何在Windows上面配置Docker for Window ...

  9. cmd窗口编码设置

    问题描述:不知道误操作了什么,导致cmd窗口的鼠标显示位置出现错位,如下: 现在要将鼠标位置调整回来. 使用工具:cmd. 操作步骤: 1.查看cmd属性可以看到 可以看到是UTF-8编码格式的,我们 ...

  10. ubuntu进行子域名爆破

    好记性不如烂笔头,此处记录一下,ubuntu进行子域名的爆破. 先记录一个在线的子域名爆破网址,无意中发现,很不错的网址,界面很干净,作者也很用心,很感谢. https://phpinfo.me/do ...