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 相关文章推荐
解决css和js的{}与smarty定界符冲突问题的两种方法
Sep 10 Javascript
js实现背景图片感应鼠标变化的方法
Feb 28 Javascript
轻松实现jquery手风琴效果
Jan 14 Javascript
jquery+CSS3实现3D拖拽相册效果
Jul 18 Javascript
input 禁止输入特殊字符的四种实现方式
Aug 24 Javascript
微信小程序 wxapp内容组件 text详细介绍
Oct 31 Javascript
利用HTML5+Socket.io实现摇一摇控制PC端歌曲切换
Jan 13 Javascript
jQuery插件HighCharts绘制的基本折线图效果示例【附demo源码下载】
Mar 07 Javascript
动态统计当前输入内容的字节、字符数的实例详解
Oct 27 Javascript
基于jquery实现九宫格拼图小游戏
Nov 30 jQuery
vue 实现根据data中的属性值来设置不同的样式
Aug 04 Javascript
video.js添加自定义组件的方法
Dec 09 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
PHP file_get_contents 函数超时的几种解决方法
2009/07/30 PHP
PHP Yaf框架的简单安装使用教程(推荐)
2016/06/08 PHP
php简单统计中文个数的方法
2016/09/30 PHP
浅谈PHP命令执行php文件需要注意的问题
2016/12/16 PHP
PHP开发中解决并发问题的几种实现方法分析
2017/11/13 PHP
JS实现随机化快速排序的实例代码
2013/08/01 Javascript
Nodejs学习笔记之Global Objects全局对象
2015/01/13 NodeJs
js实现class样式的修改、添加及删除的方法
2015/01/20 Javascript
js鼠标点击图片实现随机变换图片的方法
2015/02/16 Javascript
AngularJS入门教程之模块化操作用法示例
2016/11/02 Javascript
vue日期组件 支持vue1.0和2.0
2017/01/09 Javascript
DataTables添加额外的查询参数和删除columns等无用参数实例
2017/07/04 Javascript
js实现图片懒加载效果
2017/07/17 Javascript
vue的过滤器filter实例详解
2018/09/17 Javascript
从0到1构建vueSSR项目之路由的构建
2019/03/07 Javascript
Element ui 下拉多选时新增一个选择所有的选项
2019/08/21 Javascript
vue 动态给每个页面添加title、关键词和描述的方法
2020/08/28 Javascript
[05:56]第十六期——新进3大C之小兔基
2014/06/24 DOTA
[52:41]OG vs IG 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/20 DOTA
python将文本转换成图片输出的方法
2015/04/28 Python
Python遍历文件夹和读写文件的实现代码
2016/08/28 Python
浅谈flask截获所有访问及before/after_request修饰器
2018/01/18 Python
解决windows上安装tensorflow时报错,“DLL load failed: 找不到指定的模块”的问题
2020/05/20 Python
非凡女性奢华谦虚风格:The Modist
2017/10/28 全球购物
西班牙多品牌鞋店连锁店:Krack
2018/11/30 全球购物
构造方法和其他方法的区别?怎么调用父类的构造方法
2013/09/22 面试题
行政助理的职责
2013/11/14 职场文书
汽修专业学生自我鉴定
2013/11/16 职场文书
优秀班集体获奖感言
2014/02/03 职场文书
迟到检讨书2000字(精选篇)
2014/10/07 职场文书
交通事故代理词范文
2015/05/23 职场文书
伊索寓言读书笔记
2015/06/30 职场文书
Nginx配置https原理及实现过程详解
2021/03/31 Servers
Go语言实现一个简单的并发聊天室的项目实战
2022/03/18 Golang
Python批量解压&压缩文件夹的示例代码
2022/04/04 Python
Spring Cloud Netflix 套件中的负载均衡组件 Ribbon
2022/04/13 Java/Android