javascript --- 继承初探七日谈 (一)
原型链是javascript实现继承的默认方式。下面来一个例子看一下她的魔法吧:
首先定义三个构造函数:
function her(){
this.name = 'Anna';
this.toString = function(){
return this.name;
}
}
function his(){
this.sex = 'men';
}
function pepole(side, height){
this.name = 'Jock';
this.side = side;
this.height = 'height';
this.setArea = function(){
return this.side * this.height / 2;
}
}
接下来就是我们施展继承的魔法了:
his.prototype = new her(); pepole.prototype = new his();
发生了神马呢?在这里我们直接将对象创建在his对象的prtotype属性中,并没与去扩展这些对象的原有原型。也就是说,我们用构造函数her()创建的实例对象,用她去覆盖his构造函数的prototype属性。相同pepole也是一样,她的构造器属性prototype完全是his()通过创建实例重建的。
切记:javascript是一个完全依靠对象的语言,其中没有类的概念。因此我们需要构造一个实体new her(),然后通过实体的属性才能完成相关的继承工作,而不能直接继承her()构造函数,另外,这也确保了在继承实现以后,对her()再做任何修改,删除,添加,都不会对his()造成任何影响,因为我们所继承的不过是她所创建的一个实体。
正如上回所讲,我们对对象的prototype进行完全替换的时候(不同于向里面添加属性),与可能回对constonctor属性产生一定的副作用。
在我们完成继承相关工作之后,因该对这些对象的constructon属性进行相应的重置,这是一个非常好的习惯。
his.prototype.constructor = his; people.prototype.constructor = people;
我们来测试一下目前实现的内容:
var my = new pepole(5,10); my.setArea();
尽管my没有属于自己的toString()方法,但是我们仍然可以调用她继承来的toString()方法,虽然这里调用的是一个继承的方法,但她的this仍然指向my对象。
my.toString(); // Jock
下面我们来关注一下javascript在my.toString()被调用时究竟发生了那些事情?
1. 首先她会遍历my对象的所有属性和方法,但没有找到一个叫做toString()的方法。
2. 接着去查看my._proto_所指的对象,也就是在继承过程中由new his()所创建的实体对象。
3. 显然,javascript引擎在遍历people()实体的时候仍然不会找到toString()这个方法,然后又会检查该实体的_proto_属性,这时候该属性又会指向new her()所创建的实体对象.
4. 最终,在new her()所创建的实体中找到了toString()方法。
5. 最后, 该方法就会在my被调用,并且this也指向了my。
那么问题来了?my对象的构造函数是哪一个?
因为我们在构建继承关系时已经对相应的constructor属性进行了重置:
my.constructor === people; // true
通过instanceof操作符,我们可以验证my对象是以上三个构造函数的实例:
my instance of her; // true my instance of his; // true my instance of people; // true
同样的,我们调用构造函数原型的isPropertypeOf()方法时结果也是如此:
her.prototype,isPrototypeOf (my); // true his.prototype,isPrototypeOf (my); // true people.prototype,isPrototypeOf (my); // true
我们同样可以用其他构造函数创建对象,她们同样可以获取her()的toString()方法。
javascript --- 继承初探七日谈 (一)的更多相关文章
- javascript --- 原型初探七日谈(一)
在javascript中,像原型,闭包这样的概念,只要我们能领悟其中的原理,一切都会显得格外清晰与明了. 原型属性(prototype): 下面我们简单定义一个函数 function her(a, b ...
- javascript --- 原型初探七日谈(二)
扩展内建对象: 在javascript中,内建对象的构造函数都是可以通过其原型来进行扩展的.这意味着我们可以做一些事情,例如我们要往数组原型中添加一个新方法,就可以在其所有的数组中使用,下面我们来试试 ...
- javascript --- 原型初探七日谈(三)
原型陷阱: 在处理原型问题上时,我们要注意两种行为. 1. 当我们对原型对象执行完全替换的时候,有可能会触发原型链的某种异常. 2. prototype.constructor 属性是不可靠的. 下面 ...
- javascript继承的三种模式
javascript继承一般有三种模式:组合继承,原型式继承和寄生式继承: 1组合继承:javascript最为广泛的继承方式通过原型链实现对原型属性和方法的继承,通过构造函数实现对实例属性的继承,同 ...
- javascript继承机制的设计思想(ryf)
我一直很难理解Javascript语言的继承机制. 它没有"子类"和"父类"的概念,也没有"类"(class)和"实例" ...
- 【读书笔记】javascript 继承
在JavaScript中继承不像C#那么直接,C#中子类继承父类之后马上获得了父类的属性和方法,但JavaScript需要分步进行. 让Brid 继承 Animal,并扩展自己fly的方法. func ...
- 图解JavaScript 继承
JavaScript作为一个面向对象语言,可以实现继承是必不可少的,但是由于本身并没有类的概念(不知道这样说是否严谨,但在js中一切都类皆是对象模拟)所以在JavaScript中的继承也区别于其他的面 ...
- JavaScript强化教程——Cocos2d-JS中JavaScript继承
javaScript语言本身没有提供类,没有其它语言的类继承机制,它的继承是通过对象的原型实现的,但这不能满足Cocos2d-JS引擎的要求.由于Cocos2d-JS引擎是从Cocos2d-x演变而来 ...
- [原创]JavaScript继承详解
原文链接:http://www.cnblogs.com/sanshi/archive/2009/07/08/1519036.html 面向对象与基于对象 几乎每个开发人员都有面向对象语言(比如C++. ...
随机推荐
- Visual Studio 2015完全离线安装
虽然微软提供了Visual Studio的ISO镜像下载,但这个ISO文件并不完整,安装的过程中依然需要联网下载一些安装包,在中国特色的网络环境下导致安装过程还是非常慢的.另外,在一些网络隔离的环境中 ...
- 用BlendFunc实现舞台灯光和刮刮卡效果
[转]http://code.lovemiao.com/?p=136#more-136 之前写过一篇<不规则形状按钮的点击判定>,利用了CCRenderTexture创建一块画布,可以在上 ...
- {Reship}{Matting}Image Matting
======================================== http://www.alphamatting.com/index.html ==================== ...
- linux获取系统启动时间
1.前言 时间对操作系统来说非常重要,从内核级到应用层,时间的表达方式及精度各部相同.linux内核里面用一个名为jiffes的常量来计算时间戳.应用层有time.getdaytime等函数.今天需要 ...
- ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆AnalyzerTool分词工具.非常实用!
AnalyzerTool分词工具.非常实用! 可以查看某串字符最终被分割成什么样子,这样便于查询时深刻明白为什么有的查不到有的却能查到. package com.isoftstone.www.tool ...
- 我为什么选择使用Go语言?
谢孟军:EGO会员.GopherChina组织者.<Go Web编程>一书的作者,专注Golang技术架构.本文来自EGO会员群分享,入群方式见文末 在这里我主要想和大家分享一些Go和我个 ...
- Xcode升级插件失效,与添加插件不小心点击Skip Bundle解决办法
一.当发现升级xcode后,插件不能使用,解决办法如下: 1.查看Xcode的UUID 在终端执行 defaults read /Applications/Xcode.app/Contents/Inf ...
- HTTP-崔希凡笔记
HTTP协议(重点) 协议:协议的甲乙双方,就是客户端(浏览器)和服务器! 理解成双方通信的格式! l 请求协议: l 响应协议: 1 安装HttpWatch HttpWatch是专门为IE浏览器 ...
- TortoiseSVN汉化包装了,不管用,仍然是英文菜单
TortoiseSVN装了后,把对应的汉化包也装了,但不管用,仍然是英文菜单. 想着是因为没有重启的原因,但是重启了再装,仍然看不到中文工菜单. 想了一下,TortoiseSVN汉化包在装的时候,没有 ...
- ActionScript语言函数重载
更新:你见过JavaScript支持重载吗,规范就是这么定义的.如果不是研究Java和Flex对象的Serialization,我也不会注意它. 距离写这篇文章已有8年了,时光匆匆啊,今天整理资料时看 ...