JavaScript中创建对象和继承示例解读


Posted in Javascript onFebruary 12, 2014

对象创建:

当一个函数对象被创建时候,Function构造器产生的函数对象会运行类似这样的代码:

this.prototype={constructor:this};

假设函数F
F用new方式构造对象时,对象的constructor被设置成这个F.prototype.constructor
如果函数在创建对象前修改了函数的prototype,会影响创建出来对象的construtor属性

如:

function F(){}; 
F.prototype={constructor:'1111'}; 
var o=new F();//o.constructor===‘1111' true

继承原理:

JavaScript中的继承是使用原型链的机制,每个函数的实例都共享构造函数prototype属性中定义的数据,要使一个类继承另一个,需要把父函数实例赋值到子函数的prototype属性。并且在每次new实例对象时,对象的私有属性__proto__会被自动连接到构造函数的prototype。

instanceof就是查找实例对象的私有prototype属性链来确定是否是指定对象的实例

具体实例:

//instanceof实现 
function Myinstanceof(obj,type) 
{ 
var proto=obj.__proto__; 
while(proto) 
{ 
if(proto ===type.prototype)break; 
proto=proto.__proto__; 
} 
return proto!=null; 
} 
function View(){} 
function TreeView(){} 
TreeView.prototype=new View();//TreeView.prototype.__proto__=TreeView.prototype 自动完成 
TreeView.prototype.constructor=TreeView;//修正constructor 
var view=new TreeView();//view.__proto__=TreeView.prototype 自动完成 
alert(view instanceof View); //true 查找到view.__proto__.__proto__时找到 
alert(view instanceof TreeView); //true 查找到view.__proto__时找到 
alert(Myinstanceof(view,View)); //true 
alert(Myinstanceof(view,TreeView)); //true
Javascript 相关文章推荐
asp.net下使用jquery 的ajax+WebService+json 实现无刷新取后台值的实现代码
Sep 19 Javascript
JQuery中判断一个元素下面是否有内容或者有某个标签的判断代码
Feb 02 Javascript
js取得url地址参数实例
Feb 22 Javascript
js读写(删除)Cookie实例详解
Apr 17 Javascript
JavaScript实现判断图片是否加载完成的3种方法整理
Mar 13 Javascript
javascript实现汉字转拼音代码分享
Apr 20 Javascript
jQuery仿IOS弹出框插件
Feb 18 Javascript
node中使用es5/6以及支持性与性能对比
Aug 11 Javascript
解决element-ui中下拉菜单子选项click事件不触发的问题
Aug 22 Javascript
了解Javascript中函数作为对象的魅力
Jun 19 Javascript
mui js控制开关状态、修改switch开关的值方法
Sep 03 Javascript
微信jssdk踩坑之签名错误invalid signature
May 19 Javascript
javascript实现文本域写入字符时限定字数
Feb 12 #Javascript
js 绑定键盘鼠标事件示例代码
Feb 12 #Javascript
动态加载jquery库的方法
Feb 12 #Javascript
jquery实现页面图片等比例放大缩小功能
Feb 12 #Javascript
javascript获取web应用根目录的方法
Feb 12 #Javascript
使用javascript控制cookie显示和隐藏背景图
Feb 12 #Javascript
raphael.js绘制中国地图 地图绘制方法
Feb 12 #Javascript
You might like
PHP 模拟登陆MSN并获得用户信息
2009/05/16 PHP
php中使用__autoload()自动加载未定义类的实现代码
2013/02/06 PHP
smarty基础之拼接字符串的详解
2013/06/18 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(十四)
2014/06/26 PHP
PHP实现链式操作的三种方法详解
2017/11/16 PHP
php使用array_chunk函数将一个数组分割成多个数组
2018/12/05 PHP
Javascript实现的分页函数
2007/02/07 Javascript
js函数使用技巧之 setTimeout(function(){},0)
2009/02/09 Javascript
Javascript实现的Map集合工具类完整实例
2015/07/31 Javascript
一种新的javascript对象创建方式Object.create()
2015/12/28 Javascript
bootstrap输入框组代码分享
2016/06/07 Javascript
JS中innerHTML和pasteHTML的区别实例分析
2016/06/22 Javascript
Angular实现购物车计算示例代码
2017/02/21 Javascript
深入理解AngularJS中的ng-bind-html指令
2017/03/27 Javascript
Ajax验证用户名或昵称是否已被注册
2017/04/05 Javascript
详解Vue双向数据绑定原理解析
2017/09/11 Javascript
jQuery仿移动端支付宝键盘的实现代码
2018/08/15 jQuery
JS实现Cookie读、写、删除操作工具类示例
2018/08/28 Javascript
使用iView Upload 组件实现手动上传图片的示例代码
2018/10/01 Javascript
JavaScript常见事件处理程序实例总结
2019/01/05 Javascript
vue项目中使用vue-i18n报错的解决方法
2019/01/13 Javascript
微信小程序实现选择地址省市区三级联动
2020/06/21 Javascript
[01:45]亚洲邀请赛互动指南虚拟物品介绍
2015/01/30 DOTA
python self,cls,decorator的理解
2009/07/13 Python
使用Python写个小监控
2016/01/27 Python
Python画图学习入门教程
2016/07/01 Python
Python实现连接两个无规则列表后删除重复元素并升序排序的方法
2018/02/05 Python
Python实现查找最小的k个数示例【两种解法】
2019/01/08 Python
python返回数组的索引实例
2019/11/28 Python
用OpenCV将视频分解成单帧图片,图片合成视频示例
2019/12/10 Python
Jupyter安装链接aconda实现过程图解
2020/11/02 Python
财务与信息服务专业推荐信
2013/11/28 职场文书
幼儿园植树节活动总结
2014/07/04 职场文书
小学三好学生事迹材料
2014/08/15 职场文书
小学生感恩老师演讲稿
2014/08/28 职场文书
2014医学院领导班子对照检查材料思想汇报
2014/09/19 职场文书