JavaScript中子对象访问父对象的方式详解


Posted in Javascript onSeptember 01, 2016

在传统面向对象的编程语言里,都会提供一种子类访问父类的特殊语法,引文我们在实现子类方法往往需要父类方法的额外辅助。在这种情况下,子类通常会调用父类中的同名方法,最终以便完成工作。

javascript虽然没有类似上述的特殊语法,但我们可以造一个啊!

function her(){};
her.prototype.name = 'Anna';
her.prototype.toString = function(){
var const = this.constructor;
return const.uber ? this.const.uber.toString() + ',' + this.name : this.name;
}
function his(){};
var F = function(){};
F.prototype = her.prototype;
his.prototype = new F();
his.prototype.constructor = her;
his.uber = her.prototype;
his.prototype.name ='Jock';
function child(width, height){
this.width = width;
this.height = height;
}
var F = function(){};
F.prototype = his.prototype;
child.prototype = new F();
child.prototype.constructor = child;
child.uber = his.prototype;
child.prototype.name = 'Los';
child.prototype.getArea = function(){
return this.width * this.height;
}

我们在构建关系的过程中,我们引入了一个uber属性,并令其指向父及对象。

在这里,我们更新了以下内容:

1. 将usber属性设置成指向父对象的引用;

2. 对toString()方法进行了更新;

之前的toString()方法只是简单的返回this.name,现在我们给他添加了额外的任务,就是检查this.constructor.usber属性,如果存在就调用该属性的toString()方法。

由于this.constructor本身是一个函数,而this.constructo.usber是指向当前对象父级原型的引用,所以我们调用child实体的toString()方法时,其原型链上的toString()方法都会被调用。

var my = child(1,2);
my.toString() // Anna, Jock, Los

以上所述是小编给大家介绍的JavaScript中子对象访问父对象的方式详解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jquery 上下滚动广告
Jun 17 Javascript
基于JQuery的浮动DIV显示提示信息并自动隐藏
Feb 11 Javascript
jquery easyui 结合jsp简单展现table数据示例
Apr 18 Javascript
JavaScript截取指定长度字符串点击可以展开全部代码
Dec 04 Javascript
基于MVC+EasyUI的web开发框架之使用云打印控件C-Lodop打印页面或套打报关运单信息
Aug 29 Javascript
jQuery EasyUI 页面加载等待及页面等待层
Feb 06 Javascript
vue拦截器Vue.http.interceptors.push使用详解
Apr 22 Javascript
详解Vue 中 extend 、component 、mixins 、extends 的区别
Dec 20 Javascript
webpack v4 从dev到prd的方法
Apr 02 Javascript
jQuery实现鼠标移到某个对象时弹出显示层功能
Aug 23 jQuery
react 组件传值的三种方法
Jun 03 Javascript
js实现简单音乐播放器
Jun 30 Javascript
浅谈JavaScript 数据属性和访问器属性
Sep 01 #Javascript
老生常谈JavaScript 函数表达式
Sep 01 #Javascript
Ubuntu系统下Angularjs开发环境安装
Sep 01 #Javascript
利用Angularjs和原生JS分别实现动态效果的输入框
Sep 01 #Javascript
knockoutjs动态加载外部的file作为component中的template数据源的实现方法
Sep 01 #Javascript
深入理解jQuery3.0的domManip函数
Sep 01 #Javascript
总结AngularJS开发者最常犯的十个错误
Aug 31 #Javascript
You might like
DOTA2 玩家自创拉野攻略 特色英雄快速成长篇
2020/04/20 DOTA
php面向对象全攻略 (九)访问类型
2009/09/30 PHP
PHP字符串的连接的简单实例
2013/12/30 PHP
PHP版本常用的排序算法汇总
2015/12/20 PHP
PHP常用排序算法实例小结【基本排序,冒泡排序,快速排序,插入排序】
2017/02/07 PHP
[原创]图片分页查看
2006/08/28 Javascript
用js计算页面执行时间的函数
2006/12/07 Javascript
javascript new fun的执行过程
2010/08/05 Javascript
JavaScript设计模式之单件模式介绍
2014/12/28 Javascript
Jquery搜索父元素操作方法
2015/02/10 Javascript
JS获取表格内指定单元格html内容的方法
2015/03/31 Javascript
JavaScript中利用各种循环进行遍历的方式总结
2015/11/10 Javascript
跟我学习javascript的异步脚本加载
2015/11/20 Javascript
js+css简单实现网页换肤效果
2015/12/29 Javascript
JQuery validate插件验证用户注册信息
2016/05/11 Javascript
微信小程序 MINA文件结构
2016/10/17 Javascript
详解nodejs 文本操作模块-fs模块(五)
2016/12/23 NodeJs
jQuery+HTML5实现WebGL高性能烟花绽放动画效果【附demo源码下载】
2017/08/18 jQuery
webpack多入口文件页面打包配置详解
2018/01/09 Javascript
Vue项目打包部署到apache服务器的方法步骤
2021/02/01 Vue.js
python基础教程之字典操作详解
2014/03/25 Python
python计算对角线有理函数插值的方法
2015/05/07 Python
浅谈django中的认证与登录
2016/10/31 Python
Python使用crontab模块设置和清除定时任务操作详解
2019/04/09 Python
Django REST Framework序列化外键获取外键的值方法
2019/07/26 Python
Johnston & Murphy官网: 约翰斯顿·墨菲牛津总统鞋
2018/01/09 全球购物
求职简历的自我评价怎样写好
2013/10/07 职场文书
教师节促销方案
2014/03/22 职场文书
“四风”问题整改措施和努力方向
2014/09/20 职场文书
2014年销售助理工作总结
2014/12/01 职场文书
2015年禁毒宣传活动总结
2015/03/25 职场文书
2015年数学教研工作总结
2015/07/22 职场文书
2015年工商局个人工作总结
2015/07/23 职场文书
2016年圣诞节义工活动总结
2016/04/01 职场文书
解决tk mapper 通用mapper的bug问题
2021/06/16 Java/Android
spring cloud 配置中心native配置方式
2021/09/25 Java/Android