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 相关文章推荐
简单时间提示DEMO从0开始一直进行计时
Nov 19 Javascript
学习javascript面向对象 掌握创建对象的9种方式
Jan 04 Javascript
浏览器兼容的JS写法总结
Apr 27 Javascript
手机端实现Bootstrap简单图片轮播效果
Oct 13 Javascript
AngularJS自定义插件实现网站用户引导功能示例
Nov 07 Javascript
遍历json 对象的属性并且动态添加属性的实现
Dec 02 Javascript
JS实现的简单表单验证功能示例
Oct 13 Javascript
微信小程序利用canvas 绘制幸运大转盘功能
Jul 06 Javascript
原生JS实现获取及修改CSS样式的方法
Sep 04 Javascript
点击按钮弹出模态框的一系列操作代码实例
Mar 29 Javascript
vue学习笔记之给组件绑定原生事件操作示例
Feb 27 Javascript
vant中的toast层级改变操作
Nov 04 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
MySQL数据源表结构图示
2008/06/05 PHP
上传文件先创建目录 再上传到目录里面去
2010/12/29 PHP
PHP实现的简单三角形、矩形周长面积计算器分享
2014/11/18 PHP
PHP file_get_contents函数读取远程数据超时的解决方法
2015/05/13 PHP
Yii2组件之多图上传插件FileInput的详细使用教程
2016/06/20 PHP
javascript 静态对象和构造函数的使用和公私问题
2010/03/02 Javascript
javascript中IE浏览器不支持NEW DATE()带参数的解决方法
2012/03/01 Javascript
jQuery对html元素取值与赋值的方法
2013/11/20 Javascript
全面了解JavaScript对象进阶
2016/07/19 Javascript
javascript回到顶部特效
2016/07/30 Javascript
JavaScript中的await/async的作用和用法
2016/10/31 Javascript
微信小程序教程系列之设置标题栏和导航栏(7)
2020/06/29 Javascript
Vue响应式原理详解
2017/04/18 Javascript
详解JS数组Reduce()方法详解及高级技巧
2017/08/18 Javascript
Vue中render函数的使用方法
2018/01/31 Javascript
微信小程序使用wxParse解析html的方法教程
2018/07/06 Javascript
解决vue 界面在苹果手机上滑动点击事件等卡顿问题
2018/11/27 Javascript
node.js express框架实现文件上传与下载功能实例详解
2019/10/15 Javascript
[43:57]Liquid vs Mineski 2019国际邀请赛小组赛 BO2 第二场 8.16
2019/08/19 DOTA
[36:05]完美世界DOTA2联赛循环赛 Forest vs DM 第一场 11.06
2020/11/06 DOTA
python 输出一个两行字符的变量
2009/02/05 Python
wxPython使用系统剪切板的方法
2015/06/16 Python
Django实现登录随机验证码的示例代码
2018/06/20 Python
pycharm运行程序时在Python console窗口中运行的方法
2018/12/03 Python
django模板结构优化的方法
2019/02/28 Python
python异常处理、自定义异常、断言原理与用法分析
2020/03/23 Python
Python基于pandas爬取网页表格数据
2020/05/11 Python
opencv 图像腐蚀和图像膨胀的实现
2020/07/07 Python
Python安装第三方库攻略(pip和Anaconda)
2020/10/15 Python
Python中免验证跳转到内容页的实例代码
2020/10/23 Python
英国户外服装品牌:Craghoppers
2019/04/25 全球购物
逃课上网检讨书
2014/02/20 职场文书
感恩之星事迹材料
2014/05/03 职场文书
说明书范文
2014/05/07 职场文书
群众路线班子对照检查材料
2014/09/25 职场文书
2014院党委领导班子及其成员群众路线对照检查材料思想汇报
2014/10/04 职场文书