JS 继承总结
ES里面没有真正的继承,但是能通过某些手段达到继承效果,从而让一个类拥有另外一个类的方法 类 =>构造函数
继承描述某语言环境---魔兽世界 哈!其实我没玩过 魔兽世界里面 有Humen类 Humen类里面有Gnome(侏儒) , gnome有方法say(我的名字)
有共有属性ggroup=gnome ,humen 有共有属性hgroup=humen , 有自己名字 hname 共有方法write();
总共共3种继承方式 一种类继承 一种是原型继承 还有一种组合继承 至于其他的继承方式,本质上没啥区别
function humen(name){ //人类类
this.name=name;
this.write=function(){
console.log("write")
}
}
humen.prototype.hgroup="humen";
new humen('张三');
//传统的是在gnome里面建立一个temp属性 指向humen构造函数,从而去用humen里面this指向ganme 然后去初始化gnome里面的属性和方法(略)
/**下面是类继承 */
function gnome(name){
this.say=function(){
console.log(this.name);
};
humen.call(this,name);
}
gnome.prototype.ggroup="gnome";
var gnome=new gnome("李四");
console.log(gnome.name); //"李四"
console.log(gnome.hgroup);//"underfined" 由此可以得出这种继承方式只是借用call 或者apply 来改变this 借用构造函数初始化属性和方法
//无法继承原型上面的属性和方法 /*************************下面是原型继承 ***********************/
function gnome(name){
this.name=name;
this.say=function(){
console.log(this.name);
}
}
gnome.prototype.ggroup="gnome";
gnome.prototype=new humen(); // 这里把一些公共的参数传进去。。。
var gnome=new gnome("李四");
gnome.say();//李四
console.log(gnome.hgroup); //humen 由此得出这种继承方式能够继承原型链上面的属性和方法 但是个体的方法(this.name)需要重新写一遍 /*************************都用的不爽 前面2种一种不能继承原型 一种构造函数里面的属性需要重新定义 混合继承***********************/
function gnome(name){
this.say=function(){ //自己的方法
console.log(this.name);
};
humen.call(this,name);
}
gnome.prototype=new humen(); //new humen里面name属性是undefined 被类继承的name覆盖
gnome.prototype.ggroup="gnome";
var gnome1=new gnome("李四");
gnome1.say();//李四
gnome.prototype.constructor=gnome; //由于用原型继承 构造函数方向指向humen
console.log(gnome1.hgroup);//"humen"
console.log(gnome1.ggroup); //"gnome"
总结:每使用new 关键字new一个对象都是在创建一个空对象,改变this指针指向空对象,然后初始化其中属性和方法,还有_proto_指向原型对象,所以对于一些公用的属性和方法定义在原型对象之中,避免浪费内存,私有的(与参数相关)则放在构造函数中。类继承和原型继承都有各自的弊端,组合继承则互补,实现完美继承,注意constructor的指向
另外附上某处偷来的,自己觉得比较好的js世界里面的原型链图:
JS 继承总结的更多相关文章
- js继承
js继承有5种实现方式: 继承第一种方式:对象冒充 function Parent(username){ this.username = username; this.hello = function ...
- js继承之call,apply和prototype随谈
在js中,call,apply和prototype都可以实现对象的继承,下面我们看一个例子: function FatherObj1() { this.sayhello = "I am jo ...
- js继承精益求精之寄生式组合继承
一.混合/组合继承的不足 上一篇JS继承终于混合继承,认真思考一下,发现其还是有不足之处的: 空间上的冗余:在使用原型链的方法继承父类的原型属性(Animal.prototype)的同时,也在子类的原 ...
- 老生常谈--Js继承小结
一直以来,对Js的继承有所认识,但是认识不全面,没什么深刻印象.于是,经常性的浪费很多时间重新看博文学习继承,今天工作不是特别忙,有幸看到了http://www.slideshare.net/stoy ...
- Js继承小结
Js继承小结 一直以来,对Js的继承有所认识,但是认识不全面,没什么深刻印象.于是,经常性的浪费很多时间重新看博文学习继承,今天工作不是特别忙,有幸看到了http://www.slideshare.n ...
- js继承实现
JS实现继承可以分为:对象冒充和原型链继承 其中对象冒充又包括:临时变量,call 和 apply 临时变量方法: function Person(name,sex){ this.name = nam ...
- js继承之借用构造函数继承
我的上一篇文章介绍了,原型链继承模式.但是单纯的原型链模式并不能很好地实现继承. 一.原型链的缺点 1.1 单纯的原型链继承最大的一个缺点,来自于原型中包含引用类型的值. 本来,我们没有通过原型链实现 ...
- js继承之原型链继承
面向对象编程都会涉及到继承这个概念,JS中实现继承的方式主要是通过原型链的方法. 一.构造函数.原型与实例之间的关系 每创建一个函数,该函数就会自动带有一个 prototype 属性.该属性是个指针, ...
- js继承的常用方法
写在前面的话:这篇博客不适合对面向对象一无所知的人,如果你连_proto_.prototype...都不是很了解的话,建议还是先去了解一下JavaScript面向对象的基础知识,毕竟胖子不是一口吃成的 ...
- JS--我发现,原来你是这样的JS:面向对象编程OOP[3]--(JS继承)
一.面向对象编程(继承) 这篇博客是面向对象编程的第三篇,JS继承.继承顾名思义,就是获取父辈的各种"财产"(属性和方法). 怎么实现继承? 我们的JavaScript比较特别了, ...
随机推荐
- TIOBE 2015年7月编程语言排行榜:C++的复兴
TIOBE 2015年7月编程语言排行榜:C++的复兴 发表于2015-07-13 17:03| 16086次阅读| 来源CSDN| 128 条评论| 作者钱曙光 编程语言排行榜TIOBEC++ 摘要 ...
- JUCE 界面库显示中文乱码问题
JUCE 界面库显示中文乱码问题 环境: Windows7 64位 旗舰版 Visual Studio Ultimate 2012 JUCE 4.1 问题描述: 直接使用juce::String存储中 ...
- ABAP程序运行锁定
转自http://www.cnblogs.com/aBaoRong/archive/2012/06/15/2550458.html ABAP 程序运行锁 1. create a Table ZRUNN ...
- 自适应布局,响应式布局以及rem,em区别
一.自适应和响应式 先说共同点: 两者都是因为越来越多的 移动设备( mobile, tablet device )加入到互联网中来而出现的为移动设备提供更好的体验的技术.用技术来使网页适应从小到大( ...
- SVN 错误
SVN 的基础安装 网上查 用户账号简单的配置 1.进入 ./conf/passwd 账号创建 [users] Colin = rw Colin1 = r 2.进入 ./conf/a ...
- oracle 执行计划查看
1) sql command窗口里explain plan for select * from emp: 2) select * from table(dbms_xplan.display);
- coderforces #387 Servers(模拟)
Servers time limit per test 2 seconds memory limit per test 256 megabytes input standard input outpu ...
- Cocos2d-x 3.x 错误 cocos2dxDownloader 编译报错
因为自带的库不是自己写的代码,所以报错的当时就傻了 报错文件为Cocos2dxDownloader.java 错误铺满全屏,仔细查看发现是类的调用有问题,翻到最上边发现是有几个(很多个)类没有定义,我 ...
- IOS 制作启动画面
启动方式简述 IOS 8 及之前: Launch Images Source方式, IOS8 及之后: 1, Launch Images Source方式 : 2 , LaunchScreen. ...
- 使用snmp+mrtg监控CPU、流量、磁盘空间、内存
1.安装snmp rpm -qa|grep snmp* //查看是否安装了snmpyum -y install snmp* //安装snmp #vim /etc/snmp/snmpd.confroco ...