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 相关文章推荐
javascript游戏开发之《三国志曹操传》零部件开发(三)情景对话中仿打字机输出文字
Jan 23 Javascript
JavaScript针对网页节点的增删改查用法实例
Feb 02 Javascript
js省市区级联查询(插件版&无插件版)
Mar 21 Javascript
VUE多层路由嵌套实现代码
May 15 Javascript
Bootstrap table学习笔记(2) 前后端分页模糊查询
May 18 Javascript
vue.js语法及常用指令
Oct 29 Javascript
详解bootstrap导航栏.nav与.navbar区别
Nov 23 Javascript
详解 vue better-scroll滚动插件排坑
Feb 08 Javascript
jQuery实现的淡入淡出与滑入滑出效果示例
Apr 18 jQuery
Vue中qs插件的使用详解
Feb 07 Javascript
快速解决element的autofocus失效问题
Sep 08 Javascript
vue+elementUI动态增加表单项并添加验证的代码详解
Dec 17 Vue.js
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
linux下删除7天前日志的代码(php+shell)
2011/01/02 PHP
php字符比较函数similar_text、strnatcmp与strcasecmp用法分析
2014/11/18 PHP
document.open() 与 document.write()的区别
2007/08/13 Javascript
web性能优化之javascript性能调优
2012/12/28 Javascript
JavaScript面向对象的实现方法小结
2015/04/14 Javascript
使用jQuery的easydrag插件实现可拖动的DIV弹出框
2016/02/19 Javascript
详解用webpack2.0构建vue2.0超详细精简版
2017/04/05 Javascript
深入理解JavaScript继承的多种方式和优缺点
2017/05/12 Javascript
详解JS中的柯里化(currying)
2017/08/17 Javascript
微信小程序实现点击按钮修改view标签背景颜色功能示例【附demo源码下载】
2017/12/06 Javascript
vue 做移动端微信公众号采坑经验记录
2018/04/26 Javascript
JavaScript 异步时序问题
2020/11/20 Javascript
[48:47]VGJ.S vs NB 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
利用python程序生成word和PDF文档的方法
2017/02/14 Python
Python基于动态规划算法解决01背包问题实例
2017/12/06 Python
详解tensorflow载入数据的三种方式
2018/04/24 Python
python爬取个性签名的方法
2018/06/17 Python
python获取array中指定元素的示例
2019/11/26 Python
解决python 读取 log日志的编码问题
2019/12/24 Python
使用TensorFlow搭建一个全连接神经网络教程
2020/02/06 Python
解决pyinstaller打包运行程序时出现缺少plotly库问题
2020/06/02 Python
Python datetime模块使用方法小结
2020/06/18 Python
Python map及filter函数使用方法解析
2020/08/06 Python
聊聊python在linux下与windows下导入模块的区别说明
2021/03/03 Python
CSS Grid布局教程之什么是网格布局
2014/12/30 HTML / CSS
Gap工厂店:Gap Factory
2017/11/02 全球购物
美国汽车零部件和配件网站:CarParts
2019/03/13 全球购物
十月份红领巾广播稿
2014/01/22 职场文书
《卖木雕的少年》教学反思
2014/04/11 职场文书
捐资助学感谢信
2015/01/21 职场文书
会议欢迎词范文
2015/01/27 职场文书
学会感恩主题班会
2015/08/12 职场文书
写作指导:怎么书写竞聘演讲稿?
2019/07/04 职场文书
那些美到让人窒息的诗句,值得你收藏!
2019/08/20 职场文书
MySQL中datetime时间字段的四舍五入操作
2021/10/05 MySQL
交互式可视化js库gojs使用介绍及技巧
2022/02/18 Javascript