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 相关文章推荐
js性能优化 如何更快速加载你的JavaScript页面
Mar 17 Javascript
使用indexOf等在JavaScript的数组中进行元素查找和替换
Sep 18 Javascript
jQuery使用animate创建动画用法实例
Aug 07 Javascript
angularjs学习笔记之简单介绍
Sep 26 Javascript
利用jQuery和CSS将背景图片拉伸
Oct 16 Javascript
jquery表单验证插件formValidator使用方法
Apr 01 Javascript
脚本div实现拖放功能(两种)
Feb 13 Javascript
JS常见创建类的方法小结【工厂方式,构造器方式,原型方式,联合方式等】
Apr 01 Javascript
使用webpack编译es6代码的方法步骤
Apr 28 Javascript
微信小程序 确认框的实现(附代码)
Jul 23 Javascript
vue-router的hooks用法详解
Jun 08 Javascript
一篇文章让你搞懂JavaScript 原型和原型链
Nov 23 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代码
2012/07/14 PHP
PHP函数preg_match_all正则表达式的基本使用详细解析
2013/08/31 PHP
php阿拉伯数字转中文人民币大写
2015/12/21 PHP
php根据数据id自动生成编号的实现方法
2016/10/16 PHP
PHP删除数组中指定值的元素常用方法实例分析【4种方法】
2018/08/21 PHP
微信公众平台开发教程④ ThinkPHP框架下微信支付功能图文详解
2019/04/10 PHP
laravel 解决路由除了根目录其他都404的问题
2019/10/18 PHP
用javascript获取textarea中的光标位置
2008/05/06 Javascript
JavaScript 原型继承
2011/12/26 Javascript
js判断屏幕分辨率的代码
2013/07/16 Javascript
各种常用的JS函数整理
2013/10/25 Javascript
node.js中的http.request.end方法使用说明
2014/12/10 Javascript
jQuery插件实现可输入和自动匹配的下拉框
2016/10/24 Javascript
AngularJS动态加载模块和依赖的方法分析
2016/11/08 Javascript
jquery实时获取时间的简单实例
2017/01/26 Javascript
AngularJS实现图片上传和预览功能的方法分析
2017/11/08 Javascript
Vue render深入开发讲解
2018/04/13 Javascript
原生js+css调节音量滑块
2020/01/15 Javascript
基于JS正则表达式实现模板数据动态渲染(实现思路详解)
2020/03/07 Javascript
在Docker上部署Python的Flask框架的教程
2015/04/08 Python
Python中定时任务框架APScheduler的快速入门指南
2017/07/06 Python
对python周期性定时器的示例详解
2019/02/19 Python
python批量识别图片指定区域文字内容
2019/04/30 Python
Python实现朴素贝叶斯的学习与分类过程解析
2019/08/24 Python
python dataframe NaN处理方式
2019/12/26 Python
解决pycharm中导入自己写的.py函数出错问题
2020/02/12 Python
Soft Cotton捷克:来自爱琴海棉花的浴袍
2017/02/01 全球购物
关于Java String的一道面试题
2013/09/29 面试题
过滤器的用法
2013/10/08 面试题
实习自我鉴定
2013/12/15 职场文书
毕业班联欢会主持词
2014/03/27 职场文书
节能环保口号
2014/06/12 职场文书
2014年党员整改措施范文
2014/09/21 职场文书
PyQt5爬取12306车票信息程序的实现
2021/05/14 Python
浅谈MySQL之select优化方案
2021/08/07 MySQL
一文解答什么是MySQL的回表
2022/08/05 MySQL