javascript继承的三种模式
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继承的三种模式的更多相关文章
- JavaScript 继承的几种模式
/** * Created by 2016 on 2016/6/5. */ //1.原型链继承 //把子类的原型,定义为超类的实例 通过原型来访问超类的方法和属性 function Person(){ ...
- JavaScript继承的几种模式
原型链 让一个类的原型对象指向另一个类的实例
- JavaScript中创建对象的三种模式
JS中,便于批量创建对象的三种模式: 1.工厂模式:用一个函数封装创建对象的细节,传入必要的参数,在函数内部new一个对象并返回. 缺点:创建的对象无法识别类型(全是Object) 2.构造函数模式: ...
- JS面向对象(3) -- Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法
相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...
- hadoop学习;自己定义Input/OutputFormat;类引用mapreduce.mapper;三种模式
hadoop切割与读取输入文件的方式被定义在InputFormat接口的一个实现中.TextInputFormat是默认的实现,当你想要一次获取一行内容作为输入数据时又没有确定的键.从TextInpu ...
- JS学习笔记——JavaScript继承的6种方法(原型链、借用构造函数、组合、原型式、寄生式、寄生组合式)
JavaScript继承的6种方法 1,原型链继承 2,借用构造函数继承 3,组合继承(原型+借用构造) 4,原型式继承 5,寄生式继承 6,寄生组合式继承 1.原型链继承. <script t ...
- .net core 注入中的三种模式:Singleton、Scoped 和 Transient
从上篇内容不如题的文章<.net core 并发下的线程安全问题>扩展认识.net core注入中的三种模式:Singleton.Scoped 和 Transient 我们都知道在 Sta ...
- Javascript 创建对象的三种方法及比较【转载+整理】
https://developer.mozilla.org/zh-CN/docs/JavaScript/Guide/Inheritance_and_the_prototype_chain 本文内容 引 ...
- android中MVC,MVP和MVVM三种模式详解析
我们都知道,Android本身就采用了MVC模式,model层数据源层我们就不说了,至于view层即通过xml来体现,而 controller层的角色一般是由activity来担当的.虽然我们项目用到 ...
随机推荐
- 猫哥网络编程系列:HTTP PEM 万能调试法
注:本文内容较长且细节较多,建议先收藏再阅读,原文将在 Github 上维护与更新. 在 HTTP 接口开发与调试过程中,我们经常遇到以下类似的问题: 为什么本地环境接口可以调用成功,但放到手机上就跑 ...
- Linux scp 设置nohup后台运行
Linux scp 设置nohup后台运行 1.正常执行scp命令 2.输入ctrl + z 暂停任务 3.bg将其放入后台 4.disown -h 将这个作业忽略HUP信号 5.测试会话中断,任务继 ...
- gradle学习笔记(1)
1. 安装 (1) 下载最新gradle压缩包,解压到某处.地址是:Gradle web site: (2) 添加环境变量: 1) 变量名:GRADLE_HOM ...
- OVS 中的各种网络设备 - 每天5分钟玩转 OpenStack(128)
上一节我们启用了 Open vSwitch,本节将查看当前的网络状态并介绍 Open vSwitch 涉及的各种网络设备 初始网络状态 查看一下当前的网络状态. 控制节点 ifconfig 显示控制节 ...
- [C#] C# 知识回顾 - 表达式树 Expression Trees
C# 知识回顾 - 表达式树 Expression Trees 目录 简介 Lambda 表达式创建表达式树 API 创建表达式树 解析表达式树 表达式树的永久性 编译表达式树 执行表达式树 修改表达 ...
- “老坛泡新菜”:SOD MVVM框架,让WinForms焕发新春
火热的MVVM框架 最近几年最热门的技术之一就是前端技术了,各种前端框架,前端标准和前端设计风格层出不穷,而在众多前端框架中具有MVC,MVVM功能的框架成为耀眼新星,比如GitHub关注度很高的Vu ...
- SharePoint 2013: A feature with ID has already been installed in this farm
使用Visual Studio 2013创建一个可视web 部件,当右击项目选择"部署"时报错: "Error occurred in deployment step ' ...
- git添加GitHub远程库
已经在本地创建了一个Git仓库后,又想在GitHub创建一个Git仓库,并且让这两个仓库进行远程同步,这样,GitHub上的仓库既可以作为备份,又可以让其他人通过该仓库来协作 首先,登陆GitHub, ...
- php+websocket搭建简易聊天室实践
1.前言 公司游戏里面有个简单的聊天室,了解了之后才知道是node+websocket做的,想想php也来做个简单的聊天室.于是搜集各种资料看文档.找实例自己也写了个简单的聊天室. http连接分为短 ...
- git图像化界面GUI的使用
GIT学习笔记 一. 基础内容 1.git是一个版本控制软件,与svn类似,特点是分布式管理,不需要中间总的服务器,可以增加很多分支. 2.windows下的git叫msysgit,下载 ...