JavaScript子类用Object.getPrototypeOf去调用父类方法解析


Posted in Javascript onDecember 05, 2013

每个function有个prototype属性,称为原型。每个对象也有个原型,Firefox/Safari/Chrome/Opera 中可以通过__proto__来访问,IE6/7/8中没有提供相关接口。

function Person(){ 
    this.method1 = function(){} 
} 
Person.prototype.method2 = function(){} function Man(){} 
Man.prototype = new Person(); 
Man.prototype.m1 = function(){} 
Man.prototype.m2 = function(){} 
var m = new Man(); 
for(var a in m.__proto__){ 
    alert(a); 
}

定义了父类Person,子类Man。new一个Man的对象,打印出所有属性。

ECMAScript V5为Object添加了静态的getPrototypeOf方法( Firefox/Chrome已实现 ),用来获取对象的原型。用它可以模仿Java的super。

function Person(){ 
    this.method1 = function(){alert(1)} 
} 
Person.prototype.method2 = function(){alert(2);} function Man(){ 
    this.m1 = function(){ 
        Object.getPrototypeOf(this).method1(); 
    } 
} 
Man.prototype = new Person();//原型继承 
Man.prototype.m2 = function(){ 
    Object.getPrototypeOf(this).method2(); 
} 
  
var man = new Man(); 
man.m1(); 
man.m2();

子类Man中挂在this上的m1方法中调用父类Person中挂在this上的method1,挂在prototype上的m2方法调用父类prototype上的method2。

以上可以看出对象原型不但包括其构造器prototype上的属性,也包括构造器中this上的属性。当然由于JavaScript中上下文的原因,父类中的this不能在子类中不能很好的自动转换,需要一些技巧完成。

Java中是这样的

package bao1; class Person { 
    private String name; 
    Person(String name) { 
        this.name = name; 
    } 
    public void method1() { 
        System.out.println(this.name); 
    } 
} 
class Man extends Person{ 
    Man(String name) { 
        super(name); 
    }    
    public void m1() { 
        super.method1(); 
    } 
} 
public class Test { 
    public static void main(String[] args) {         
        Man man1 = new Man("Jack"); 
        man1.m1(); 
    } 
}
Javascript 相关文章推荐
仿中关村在线首页弹出式广告插件(jQuery版)
May 03 Javascript
jQuery ajax serialize()方法的使用以及常见问题解决
Jan 27 Javascript
jQuery之选择组件的深入解析
Jun 19 Javascript
window.navigate 与 window.location.href 的使用区别介绍
Sep 21 Javascript
如何创建一个JavaScript弹出DIV窗口层的效果
Sep 25 Javascript
自己用jQuery写了一个图片的马赛克消失效果
May 04 Javascript
使用javascript实现json数据以csv格式下载
Jan 09 Javascript
JavaScript jquery及AJAX小结
Jan 24 Javascript
深入理解Vuex 模块化(module)
Sep 26 Javascript
微信小程序地图导航功能实现完整源代码附效果图(推荐)
Apr 28 Javascript
Layui给switch添加响应事件的例子
Sep 03 Javascript
vue cli4下环境变量和模式示例详解
Apr 09 Javascript
jQuery表格插件ParamQuery简单使用方法示例
Dec 05 #Javascript
各浏览器对document.getElementById等方法的实现差异解析
Dec 05 #Javascript
给事件响应函数传参数的四种方式小结
Dec 05 #Javascript
弹出最简单的模式化遮罩层的js代码
Dec 04 #Javascript
js如何设置在iframe框架中指定div不显示
Dec 04 #Javascript
jquery动态改变onclick属性导致失效的问题解决方法
Dec 04 #Javascript
javascript设置金额样式转换保留两位小数示例代码
Dec 04 #Javascript
You might like
php图片处理:加水印、缩略图的实现(自定义函数:watermark、thumbnail)
2010/12/02 PHP
微信公众号开发客服接口实例代码
2016/10/21 PHP
PHP实现的mysql主从数据库状态检测功能示例
2017/07/20 PHP
PHP文字转图片功能原理与实现方法分析
2017/08/31 PHP
PHP实现的大文件切割与合并功能示例
2018/04/10 PHP
文本框回车提交与禁止提交示例
2013/09/27 Javascript
简单的js表单验证函数
2013/10/28 Javascript
Angular.js与Bootstrap相结合实现表格分页代码
2016/04/12 Javascript
jquery实现简单Tab切换菜单效果
2020/07/17 Javascript
AngularJS控制器之间的数据共享及通信详解
2016/08/01 Javascript
微信小程序开发之从相册获取图片 使用相机拍照 本地图片上传
2017/04/18 Javascript
深入理解Vue-cli搭建项目后的目录结构探秘
2017/07/13 Javascript
前端html中jQuery实现对文本的搜索功能并把搜索相关内容显示出来
2017/11/14 jQuery
three.js搭建室内场景教程
2018/12/30 Javascript
vue中$nextTick的用法讲解
2019/01/17 Javascript
vue 对象添加或删除成员时无法实时更新的解决方法
2019/05/01 Javascript
原生js实现3D轮播图
2020/03/21 Javascript
[45:32]Liquid vs LGD 2018国际邀请赛淘汰赛BO3 第二场 8.23
2018/08/24 DOTA
Python多线程同步Lock、RLock、Semaphore、Event实例
2014/11/21 Python
使用70行Python代码实现一个递归下降解析器的教程
2015/04/17 Python
Python 中字符串拼接的多种方法
2018/07/30 Python
python利用selenium进行浏览器爬虫
2019/04/25 Python
python使用pip安装模块出现ReadTimeoutError: HTTPSConnectionPool的解决方法
2019/10/04 Python
Django项目创建及管理实现流程详解
2020/10/13 Python
HTML5中语义化 b 和 i 标签
2008/10/17 HTML / CSS
日本最大的药妆连锁店:Matsukiyo松本清药妆店
2017/11/23 全球购物
贝佳斯官方网站:Borghese
2020/05/08 全球购物
新闻专业大学生找工作的自我评价
2013/10/30 职场文书
《小山羊和小灰兔》教学反思
2014/02/19 职场文书
数据保密承诺书
2014/06/03 职场文书
代办出身证明书
2014/10/21 职场文书
幼儿园老师新年寄语2015
2014/12/08 职场文书
2015年酒店服务员工作总结
2015/05/18 职场文书
2015年预防青少年违法犯罪工作总结
2015/05/22 职场文书
高中诗歌鉴赏教学反思
2016/02/16 职场文书
MutationObserver在页面水印实现起到的作用详解
2022/07/07 Javascript