一个JS继承小工具-JavaSript-爱易网页

一个JS继承小工具

日期：2014-05-16　浏览次数：20290 次

【分享】一个JS继承小工具
话就不多了,直接上代码吧,里面有注释都写的很清楚了,欢迎拍砖.
好久没来了..顺便三点分.

HTML code

<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <SCRIPT LANGUAGE="JavaScript">
  <!--
  // ----------------工具类--------------------
  var Class = {
    /**
     * 继承原型,参考自<javascript设计模式>
     * 子类方法中调用父类的方法: Man.superclass.sayName.call(this);
     */
    extend:function(subClass,superClass){
        var F = function(){};
        F.prototype = superClass.prototype;
        subClass.prototype = new F();
        // 避免父类的构造函数
        subClass.prototype.constructor = subClass;
        
        subClass.superclass = superClass.prototype;
        if(superClass.prototype.constructor == Object.prototype.constructor){
            superClass.prototype.constructor = superClass;
        }
    }    
}

Object.prototype.callSuper = function(superClass) {
        if(arguments.length == 0){
            throw new Error('callSuper方法必须含有一个参数');
        }
        var caller = arguments.callee.caller;
        // 子类引用
        var subInstance = this;
        // 子类参数
        var callerArgs = caller.arguments;
        var argsArr = [];
        
        for(var i=0,len=callerArgs.length; i<len; i++) {
            argsArr.push(callerArgs[i]);
        }
        
        superClass.apply(subInstance,argsArr);
    }
    // ------------------------------------


    // Demo
    // 声明父类
    var Person = function(param){
        this.name = param.name;
        this.age = param.age;
    }
    Person.prototype.sayName = function(){
        alert("My name is " + this.name);
    }
    Person.prototype.sayAge = function(){
        alert("My age is " + this.age);
    }
    Person.prototype.getAge = function(){
        return this.age;
    }


    // 声明子类
    var Man = function(param){
        // 调用父类的构造函数
        this.callSuper(Person);
    }
    // 继承父类
    Class.extend(Man,Person);
    
    // 覆盖父类的sayAge方法
    Man.prototype.sayAge = function(){
        alert(this.name + "'s age is " + this.age);
    }
    // 覆盖父类的方法,并且调用父类原来的方法
    Man.prototype.getAge = function(){
        // 先调用父类方法返回年龄
        var age = Man.superclass.getAge.call(this);
        // 年龄+1
        alert(this.name + "'s age is " + (age + 1));
    }


    // 测试
    var man = new Man({name:"Jim",age:22});
    man.sayName(); // 这里调用父类的方法
    man.sayAge();  // 这里调用自己的方法
    man.getAge();  
    // 
  //-->
  </SCRIPT>
 </HEAD>
 <BODY>   
 </BODY>
</HTML>

------解决方案--------------------
支持楼主，谢谢分享，先留言再收藏代码呀！！
------解决方案--------------------
记得 Caller 好像是一被删除的属性...对于继承这方面代码..已经很久没注意过了..一直用YUI3提供的几上函数处理 YUI.opp 模块提供有 extend augment...这二个楼主有兴趣可以看源代码
------解决方案--------------------

探讨

支持楼主，谢谢分享，先留言再收藏代码呀！！

------解决方案--------------------

探讨
好久没来了..顺便三点分.

------解决方案--------------------
听说回复都可以得分?
------解决方案--------------------
接分接分等下再来研究代码
------解决方案--------------------
接分接分等下再来研究代码
------解决方案--------------------
谢谢楼主共享。

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

一个JS继承小工具

相关资料更多>

推荐阅读更多>