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 相关文章推荐
javascript创建函数的20种方式汇总
Jun 23 Javascript
jQuery解决浏览器兼容性问题案例分析
Apr 15 Javascript
微信小程序 textarea 详解及简单使用方法
Dec 05 Javascript
canvas 绘制圆形时钟
Feb 22 Javascript
Angular排序实例详解
Jun 28 Javascript
使用react-router4.0实现重定向和404功能的方法
Aug 28 Javascript
vue实现手机号码抽奖上下滚动动画示例
Oct 18 Javascript
Vue一次性简洁明了引入所有公共组件的方法
Nov 28 Javascript
JavaScript实现汉字转换为拼音及缩写的方法示例
Mar 28 Javascript
详解vue-property-decorator使用手册
Jul 29 Javascript
Vue formData实现图片上传
Aug 20 Javascript
JavaScript编写开发动态时钟
Jul 29 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使用imagick读取PDF生成png缩略图的两种方法
2014/03/20 PHP
php jsonp单引号转义
2014/11/23 PHP
Win10 下安装配置IIS + MySQL + nginx + php7.1.7
2017/08/04 PHP
JQuery将文本转化成JSON对象需要注意的问题
2011/05/09 Javascript
JQuery与JSon实现的无刷新分页代码
2011/09/13 Javascript
Js+Flash实现访问剪切板操作
2012/11/20 Javascript
Javascript实现计算个人所得税
2015/05/10 Javascript
js实现选中页面文字将其分享到新浪微博
2015/11/05 Javascript
Bootstrap按钮下拉菜单组件详解
2016/05/10 Javascript
Three.js学习之文字形状及自定义形状
2016/08/01 Javascript
jQuery事件绑定用法详解
2016/09/08 Javascript
用js控件div的滚动条,让它在内容更新时自动滚到底部的实现方法
2016/10/27 Javascript
详解webpack 如何集成第三方js库
2017/06/29 Javascript
如何使用JS在HTML中自定义字符串格式化
2017/07/20 Javascript
微信小程序 页面跳转传值实现代码
2017/07/27 Javascript
layui table设置前台过滤转义等方法
2018/08/17 Javascript
基于html+css+js实现简易计算器代码实例
2020/02/28 Javascript
[01:32]TI奖金增速竟因它再创新高!DOTA2勇士令状不朽珍藏Ⅰ饰品欣赏
2018/05/18 DOTA
Python实现购物车购物小程序
2018/04/18 Python
浅谈python中np.array的shape( ,)与( ,1)的区别
2018/06/04 Python
python验证身份证信息实例代码
2019/05/06 Python
python使用requests.session模拟登录
2019/08/09 Python
Python 批量刷博客园访问量脚本过程解析
2019/08/30 Python
浅谈CSS3中的变形功能-transform功能
2017/12/27 HTML / CSS
有关HTML5页面在iPhoneX适配问题
2017/11/13 HTML / CSS
联想香港官方网站及网店:Lenovo香港
2018/04/13 全球购物
介绍一下Prototype的$()函数,$F()函数,$A()函数都是什么作用?
2014/03/05 面试题
年终总结会主持词
2014/03/25 职场文书
学生会竞选演讲稿纪检部
2014/08/25 职场文书
自习课吵闹检讨书范文
2014/09/26 职场文书
干部职工纪律作风整改措施思想汇报
2014/10/11 职场文书
工作疏忽检讨书500字
2014/10/26 职场文书
初中语文教学随笔
2015/08/15 职场文书
2016公司新年问候语
2015/11/11 职场文书
浅谈JS的原型和原型链
2021/06/04 Javascript
Python答题卡识别并给出分数的实现代码
2021/06/22 Python