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 相关文章推荐
FileUpload上传图片(图片不变形)
Aug 05 Javascript
jquery获取当前日期的方法
Jan 14 Javascript
jQuery插件zepto.js简单实现tab切换
Jun 16 Javascript
jquery不常用方法汇总
Jul 26 Javascript
学习使用grunt来打包JavaScript和CSS程序的教程
Jan 04 Javascript
vue-cli+webpack记事本项目创建
Apr 01 Javascript
日期时间范围选择插件:daterangepicker使用总结(必看篇)
Sep 14 Javascript
使用D3.js+Vue实现一个简单的柱形图
Aug 05 Javascript
详解在React中跨组件分发状态的三种方法
Aug 09 Javascript
Webpack4 使用Babel处理ES6语法的方法示例
Mar 07 Javascript
el-input 标签中密码的显示和隐藏功能的实例代码
Jul 19 Javascript
原生JavaScript创建不可变对象的方法简单示例
May 07 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 Static关键字实用方法
2010/06/04 PHP
ThinkPHP3.2.3框架实现的空模块、空控制器、空操作,跳转到错误404页面图文详解
2019/04/03 PHP
javascript下有关dom以及xml节点访问兼容问题
2007/11/26 Javascript
有关于JS构造函数的重载和工厂方法
2013/04/07 Javascript
javascript ajax 仿百度分页函数
2013/10/29 Javascript
JavaScript格式化日期时间的方法和自定义格式化函数示例
2014/04/04 Javascript
原生js实现jquery函数animate()动画效果的简单实例
2016/08/21 Javascript
web打印小结
2017/01/11 Javascript
Vue中定义全局变量与常量的各种方式详解
2017/08/23 Javascript
vue中实现先请求数据再渲染dom分享
2018/03/17 Javascript
jquery 通过ajax请求获取后台数据显示在表格上的方法
2018/08/08 jQuery
React 项目迁移 Webpack Babel7的实现
2018/09/12 Javascript
傻瓜式解读koa中间件处理模块koa-compose的使用
2018/10/30 Javascript
jQuery三组基本动画与自定义动画操作实例总结
2020/05/09 jQuery
vue+axios 拦截器实现统一token的案例
2020/09/11 Javascript
vue3.0中setup使用(两种用法)
2020/12/02 Vue.js
Python中的类学习笔记
2014/09/23 Python
pycharm恢复默认设置或者是替换pycharm的解释器实例
2018/10/29 Python
Python @property装饰器原理解析
2020/01/22 Python
解决jupyter notebook import error但是命令提示符import正常的问题
2020/04/15 Python
基于python实现计算两组数据P值
2020/07/10 Python
python3.7 openpyxl 在excel单元格中写入数据实例
2020/09/01 Python
如何进行Linux分区优化
2016/09/13 面试题
个人找工作自荐信格式
2013/09/21 职场文书
《月迹》教学反思
2014/02/19 职场文书
实习评语大全
2014/04/26 职场文书
公司离职证明标准范本
2014/10/05 职场文书
goland 清除所有的默认设置操作
2021/04/28 Golang
MySQL表字段时间设置默认值
2021/05/13 MySQL
如何解决.cuda()加载用时很长的问题
2021/05/24 Python
Python函数式编程中itertools模块详解
2021/09/15 Python
使用javascript解析二维码的三种方式
2021/11/11 Javascript
攻略丨滑雪究竟该选哪款对讲机?
2022/02/18 无线电
Python调用腾讯API实现人脸身份证比对功能
2022/04/04 Python
Python获取字典中某个key的value
2022/04/13 Python
基于Redission的分布式锁实战
2022/08/14 Redis