JavaScript对象创建及继承原理实例解剖


Posted in Javascript onFebruary 28, 2013

对象创建
当一个函数对象被创建时候,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

上面自定义的Myinstanceof就是自己实现的一个instanceof功能的函数,由于IE内核实例存储prototype不是__proto__,所以Myinstanceof会无法通过,其他浏览器上应该都没有问题
Javascript 相关文章推荐
JavaScript 继承详解 第一篇
Aug 30 Javascript
创建js对象和js类的方法汇总
Dec 24 Javascript
JQuery实现带排序功能的权限选择实例
May 18 Javascript
仅30行代码实现Javascript中的MVC
Feb 15 Javascript
基于AGS JS开发自定义贴图图层
Mar 31 Javascript
vue 微信授权登录解决方案
Apr 10 Javascript
Jquery获取radio选中值实例总结
Jan 17 jQuery
javascript 内存模型实例详解
Apr 18 Javascript
vue 实现click同时传入事件对象和自定义参数
Jan 29 Vue.js
微信小程序基础教程之echart的使用
Jun 01 Javascript
vue+elementui 实现新增和修改共用一个弹框的完整代码
Jun 08 Vue.js
react中useState使用:如何实现在当前表格直接更改数据
Aug 05 Javascript
jquery显示和隐藏div特效实例
Feb 27 #Javascript
JS等比例缩小图片尺寸的实例
Feb 27 #Javascript
JQuery切换显示的效果实例代码
Feb 27 #Javascript
innerText和textContent对比及使用介绍
Feb 27 #Javascript
根据IP的地址,区分不同的地区,查看不同的网站页面的js代码
Feb 26 #Javascript
jQuery easyui datagrid动态查询数据实例讲解
Feb 26 #Javascript
jQuery建立一个按字母顺序排列的友好页面索引(兼容IE6/7/8)
Feb 26 #Javascript
You might like
PHP房贷计算器实例代码,等额本息,等额本金
2017/04/01 PHP
javascript 最常用的10个自定义函数[推荐]
2009/12/26 Javascript
jQuery下通过$.browser来判断浏览器.
2011/04/05 Javascript
Javascript Throttle & Debounce应用介绍
2013/03/19 Javascript
jQuery布局插件UI Layout简介及使用方法
2013/04/03 Javascript
jquery ready(fn)事件使用介绍
2013/08/21 Javascript
javascript trim函数在IE下不能用的解决方法
2014/09/12 Javascript
jQuery使用之处理页面元素用法实例
2015/01/19 Javascript
jQuery实现仿Google首页拖动效果的方法
2015/05/04 Javascript
JavaScript中的pow()方法使用详解
2015/06/15 Javascript
JS实现部分HTML固定页面顶部随屏滚动效果
2015/12/24 Javascript
老司机带你解读jQuery插件开发流程
2016/05/16 Javascript
AngularJS之依赖注入模拟实现
2016/08/19 Javascript
使用Vue.js创建一个时间跟踪的单页应用
2016/11/28 Javascript
JavaScript中捕获/阻止捕获、冒泡/阻止冒泡方法
2016/12/07 Javascript
基于vue的短信验证码倒计时demo
2017/09/13 Javascript
ES6解构赋值实例详解
2017/10/31 Javascript
javascript 原型与原型链的理解及实例分析
2019/11/23 Javascript
详解JavaScript中分解数字的三种方法
2021/01/05 Javascript
vue3中轻松实现switch功能组件的全过程
2021/01/07 Vue.js
[42:39]老党炸弹人试玩视频
2014/09/03 DOTA
Pycharm远程调试openstack的方法
2017/11/21 Python
Python代理IP爬虫的新手使用教程
2019/09/05 Python
Python 函数用法简单示例【定义、参数、返回值、函数嵌套】
2019/09/20 Python
Python如何使用bokeh包和geojson数据绘制地图
2020/03/21 Python
python单例模式的应用场景实例讲解
2021/02/24 Python
html5的画布canvas——画出简单的矩形、三角形实例代码
2013/06/09 HTML / CSS
俄罗斯购买自行车网站:Vamvelosiped
2021/01/29 全球购物
大二自我鉴定范文
2013/10/05 职场文书
小学开学典礼主持词
2014/03/19 职场文书
学员自我鉴定
2014/03/19 职场文书
西柏坡导游词
2015/02/05 职场文书
兴趣班停课通知
2015/04/24 职场文书
2015年小学英语教师工作总结
2015/05/12 职场文书
用javascript制作qq注册动态页面
2021/04/14 Javascript
Mysql案例刨析事务隔离级别
2021/09/25 MySQL