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 相关文章推荐
xmlHTTP实例
Oct 24 Javascript
使用JavaScript 实现对象 匀速/变速运动的方法
May 08 Javascript
JavaScript常用脚本汇总(一)
Mar 04 Javascript
javascript实现图片轮播效果
Jan 20 Javascript
Javascript中 toFixed四舍六入方法
Aug 21 Javascript
使用vue官方提供的模板vue-cli搭建一个helloWorld案例分析
Jan 16 Javascript
浅谈Koa2框架利用CORS完成跨域ajax请求
Mar 06 Javascript
4个顶级开源JavaScript图表库
Sep 29 Javascript
详解vue-cli+element-ui树形表格(多级表格折腾小计)
Apr 17 Javascript
js实现多张图片每隔一秒切换一张图片
Jul 29 Javascript
layui 数据表格复选框实现单选功能的例子
Sep 19 Javascript
解决vue 使用setTimeout,离开当前路由setTimeout未销毁的问题
Jul 21 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
ThinkPHP之M方法实例详解
2014/06/20 PHP
fancybox1.3.1 基于Jquery的插件在IE中图片显示问题
2010/10/01 Javascript
jquery sortable的拖动方法示例详解
2014/01/16 Javascript
jQuery实现点击按钮弹出可关闭层的浮动层插件
2015/09/19 Javascript
Jquery揭秘系列:ajax原生js实现详解(推荐)
2016/06/08 Javascript
详解如何实现一个简单的 vuex
2018/02/10 Javascript
JavaScript常用数学函数用法示例
2018/05/14 Javascript
JS实现点击生成UUID的方法完整实例【基于jQuery】
2019/06/12 jQuery
vue 关闭浏览器窗口的时候,清空localStorage的数据示例
2019/11/06 Javascript
如何基于原生javaScript生成带图片的二维码
2019/11/21 Javascript
vue动态设置路由权限的主要思路
2021/01/13 Vue.js
[00:20]TI9观赛名额抽取Ⅱ
2019/07/24 DOTA
python进阶教程之词典、字典、dict
2014/08/29 Python
机器学习经典算法-logistic回归代码详解
2017/12/22 Python
Python干货:分享Python绘制六种可视化图表
2018/08/27 Python
对python 判断数字是否小于0的方法详解
2019/01/26 Python
python二进制读写及特殊码同步实现详解
2019/10/11 Python
Tensorflow实现在训练好的模型上进行测试
2020/01/20 Python
解决Keras 与 Tensorflow 版本之间的兼容性问题
2020/02/07 Python
python手机号前7位归属地爬虫代码实例
2020/03/31 Python
Python3利用scapy局域网实现自动多线程arp扫描功能
2021/01/21 Python
html标签之Object和EMBED标签详解
2013/07/04 HTML / CSS
阿提哈德航空官方网站:Etihad Airways
2017/01/06 全球购物
Omio俄罗斯:一次搜索公共汽车、火车和飞机的机票
2018/11/17 全球购物
C和C++经典笔试题附答案解析
2014/08/18 面试题
大专生自荐信
2013/10/04 职场文书
航空大学应届生求职信
2013/11/10 职场文书
英文简历中的自我评价用语
2013/12/09 职场文书
青年教师典范事迹材料
2014/01/31 职场文书
《十六年前的回忆》教学反思
2014/02/14 职场文书
购房意向书
2014/08/30 职场文书
本科毕业论文指导教师评语
2014/12/30 职场文书
英语感谢信范文
2015/01/20 职场文书
劳动者解除劳动合同通知书
2015/04/16 职场文书
苦儿流浪记读书笔记
2015/07/01 职场文书
企业开发CSS命名BEM代码规范实践
2022/02/12 HTML / CSS