js模拟类继承小例子

 更新时间:2010年07月17日 18:49:17   作者:  
使用js模拟类继承小例子,学习js面向对象的朋友可以参考下。
复制代码 代码如下:

//使用原型继承,中间使用临时对象作为Child的原型属性,临时对象的原型属性再指向父类的原型,
//防止所有子类和父类原型属性都指向通一个对象.
//这样当修改子类的原型属性,就不会影响其他子类和父类
function extend(Child, Parent) {
var F = function(){};
F.prototype = Parent.prototype;
Child.prototype = new F();
Child.prototype.constructor = Child;
Child.base = Parent.prototype;
}

function Parent(name)
{
this.aa = 123;
this.getName = function() {return name;}; //使用闭包模拟私有成员
this.setName = function(value){name=value;};
}
Parent.prototype.print = function(){alert("print!");};
Parent.prototype.hello = function()
{
alert(this.getName() + "Parent")
};

function Child(name,age)
{
Parent.apply(this, arguments);//调用父类构造函数来继承父类定义的属性
this.age = age;
}
extend(Child,Parent); //继承Parent

Child.prototype.hello = function() //重写父类hello方法
{
alert(this.getName() + "Child");

Parent.prototype.hello.apply(this,arguments); //调用父类同名方法
};
//子类方法
Child.prototype.doSomething = function(){ alert(this.age + "Child doSomething"); };

var p1 = new Child("xhan",22);

var p2 = new Child("xxx",33);

p1.hello();
p2.hello();

p1.doSomething(); //子类方法
p1.print(); //父类方法

alert(p1 instanceof Child); //true
alert(p1 instanceof Parent);//true

相关文章

  • js 页面传参数时 参数值含特殊字符的问题

    js 页面传参数时 参数值含特殊字符的问题

    解决方法就是利用js的escape函数,这个函数在解决中文乱码等方面应用的比较广泛。推荐使用。
    2009-12-12
  • 微信小程序—setTimeOut定时器的问题及解决

    微信小程序—setTimeOut定时器的问题及解决

    这篇文章主要介绍了微信小程序—setTimeOut定时器的问题及解决,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-07-07
  • TypeScript中定义变量方式以及数据类型详解

    TypeScript中定义变量方式以及数据类型详解

    TypeScript支持 JavaScript的所有语法和语义,同时通过作为ECMAScript的超集来提供一些额外的功能,如类型检测和更丰富的语法,这篇文章主要给大家介绍了关于TypeScript中定义变量方式以及数据类型详解的相关资料,需要的朋友可以参考下
    2022-08-08
  • JavaScript表格隔行变色和Tab标签页特效示例【附jQuery版】

    JavaScript表格隔行变色和Tab标签页特效示例【附jQuery版】

    这篇文章主要介绍了JavaScript表格隔行变色和Tab标签页特效,结合实例形式分析了javascript元素遍历、事件响应相关操作技巧,并附带jQuery对应实现代码供大家参考,需要的朋友可以参考下
    2019-07-07
  • 常用原生JS兼容性写法汇总

    常用原生JS兼容性写法汇总

    这篇文章主要为大家详细汇总了常用原生JS兼容性写法,感兴趣的小伙伴们可以参考一下
    2016-04-04
  • TypeScript命名空间合并讲解

    TypeScript命名空间合并讲解

    这篇文章主要介绍了TS命名空间合并讲解,回顾上一节的内容,在上一节中我们介绍了TS中最常见的声明合并:接口合并,今天要讲的内容也是TS中的声明合并,但这次是命名空间相关的合并,需要的朋友可以参考一下
    2021-12-12
  • ES6 Symbol在对象中的作用实例分析

    ES6 Symbol在对象中的作用实例分析

    这篇文章主要介绍了ES6 Symbol在对象中的作用,结合实例形式分析了ES6 Symbol在对象中声明、使用方法与相关注意事项,需要的朋友可以参考下
    2020-06-06
  • JS特权方法定义作用以及与公有方法的区别

    JS特权方法定义作用以及与公有方法的区别

    在构造函数内部通过this关键字定义的的方法为特权方法它的作用为在构造函数外面公开访问(仅限于实例化的对象),而且还能够访问私有成员和方法,感兴趣的你可以参考下哈
    2013-03-03
  • 基于 D3.js 绘制动态进度条的实例详解

    基于 D3.js 绘制动态进度条的实例详解

    D3是一个被数据驱动的文档。这篇文章主要介绍了基于 D3.js 绘制动态进度条的方法,需要的朋友可以参考下
    2018-02-02
  • JavaScript 高性能数组去重的方法

    JavaScript 高性能数组去重的方法

    这篇文章主要介绍了JavaScript 高性能数组去重的方法,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
    2018-09-09

最新评论