Prototype 学习——Class对象

Prototype’s object for class-based OOP.

prototype OOP编程的基础，详细说明一下源码：

view plaincopy to clipboardprint?
  1. /* Based on Alex Arnell's inheritance implementation. */
  3. var Class = (function() {
  4. //临时存储parent的prototype
  5. function subclass() {};
  7. //创建类的方法
  8. function create() {
  9. var parent = null, properties = $A(arguments);
  10. //检查新建一个类时，是否指定了一个父对象
  11. //如果指定了父类，赋值给parent
  12. if (Object.isFunction(properties[0]))
  13. parent = properties.shift();
  15. //真正用作返回的类，在创建实例时，将调用initialize方法进行初始化
  16. function klass() {
  17. this.initialize.apply(this, arguments);
  18. }
  20. //给klass添加addMethods方法，在调用create方法之后
  21. //仍可以调用addMethods方法进行类级别的方法扩充
  22. Object.extend(klass, Class.Methods);
  23. //给返回的类添加两个属性，superclass：父类，subclasses：子类的集合
  24. klass.superclass = parent;
  25. klass.subclasses = [];
  27. //如果创建类时指定了父对象，则把klass的原型指向父对象的实例，实现原型链继承
  28. if (parent) {
  29. subclass.prototype = parent.prototype;
  30. klass.prototype = new subclass;
  31. //为父类添加子类，维护父类的子类集合
  32. parent.subclasses.push(klass);
  33. }
  35. //向新类添加方法
  36. for (var i = 0; i < properties.length; i++)
  37. klass.addMethods(properties[i]);
  39. //如果没有指定初始化方法，则默认把一个空方法赋给初始化方法
  40. if (!klass.prototype.initialize)
  41. klass.prototype.initialize = Prototype.emptyFunction;
  43. /*
  44. * 修正新类的构造函数，使得构造函数指向自己,这里特意说一下（如果注释掉下面这行）：
  45. * var Person=Class.create();
  46. * var p1=new Person();
  47. * alert(p1.constructor==Person) //true
  48. * var Man=Class.create(Person)
  49. * var m1=new Man();
  50. * alert(m1.constrcutor==Man) //false
  51. * alert(m1.constrcutor==Person) //true
  52. * alert(m1.construcctor==p1.constrcutor) //true
  53. *
  54. * 看出问题来了吧？Man的构造函数竟然指向了Person的构造函数
  55. * 问题的根源在klass.prototype = new subclass;这句话
  56. * 具体原因我就不解释了，要详细理解的请查看《JavaScript语言精髓与编程实践》155~160页
  57. */
  58. klass.prototype.constructor = klass;
  59. return klass;
  60. }
  62. //把创建类时的方法添加到新类，或者在创建完类之后在添加类级别的方法
  63. function addMethods(source) {
  64. //取得新类的父类
  65. var ancestor = this.superclass && this.superclass.prototype;
  66. var properties = Object.keys(source);
  68. //貌似下面的判断总是为真，不知道为什么这么写，知道的告诉我?
  69. if (!Object.keys({ toString: true }).length) {
  70. //如果新类重写了toString和valueOf方法则添加之
  71. if (source.toString != Object.prototype.toString)
  72. properties.push("toString");
  73. if (source.valueOf != Object.prototype.valueOf)
  74. properties.push("valueOf");
  75. }
  77. //遍历所有的新类声明中的方法
  78. for (var i = 0, length = properties.length; i < length; i++) {
  79. //property是函数名称，value是函数体
  80. var property = properties[i], value = source[property];
  81. //判断这个方法是否需要调用父类的同名方法
  82. if (ancestor && Object.isFunction(value) &&
  83. value.argumentNames().first() == "$super") {
  84. var method = value;
  85. //这里很重要！
  86. //替换$super参数，使得这个参数指向父类的同名方法
  87. //这里应用了Function的wrap方法，wrap方法的解释请参考【Prototype 学习——Function对象】
  88. //method是新定义的方法，所以他的第一个参数为$super,然后从'='到'.'之间返回的是父类的同名方法
  89. //最后调用wrap方法把$super参数替换成父类的同名方法，这样在子类调用$super()时，将调用父类的同名方法
  90. //这里构造的非常棒！值得思考
  91. value = (function(m) {
  92. return function() { return ancestor[m].apply(this, arguments); };
  93. })(property).wrap(method);
  95. //将新产生的value（即经过修改过的子类方法）的valueOf和toString指向原子类的同名方法
  96. //这里是在修正调用wrap方法之后的遗留问题
  97. value.valueOf = method.valueOf.bind(method);
  98. value.toString = method.toString.bind(method);
  99. }
  100. //把方法添加到新类中
  101. this.prototype[property] = value;
  102. }
  104. return this;
  105. }
  107. //返回Class的可调用方法
  108. return {
  109. create: create,
  110. Methods: {
  111. addMethods: addMethods
  112. }
  113. };
  114. })();

这个类就提供了2个方法：create和addMethods，上面的源码注释中已经说明的很清楚了，下面就看些例子，具体说明一下用法：

view plaincopy to clipboardprint?
  1. //声明Person类，并定义初始化方法
  2. var Person = Class.create({
  3. initialize: function(name) {
  4. this.name = name;
  5. },
  6. say: function(message) {
  7. return this.name + ': ' + message;
  8. }
  9. });
  11. // when subclassing, specify the class you want to inherit from
  12. var Pirate = Class.create(Person, {
  13. // redefine the speak method
  14. //注意这里的$super用法，在对照源码中的解释仔细看一下
  15. say: function($super, message) {
  16. return $super(message) + ', yarr!';
  17. }
  18. });
  20. var john = new Pirate('Long John');
  21. john.say('ahoy matey');
  22. // -> "Long John: ahoy matey, yarr!"

  1. var john = new Pirate('Long John');
  2. john.sleep();
  3. // -> ERROR: sleep is not a method
  4. // every person should be able to sleep, not just pirates!
  6. //这里是addMethods的用法，可以在类级别扩充方法
  7. Person.addMethods({
  8. sleep: function() {
  9. return this.say('ZzZ');
  10. }
  11. });
  12. john.sleep();

view plaincopy to clipboardprint?
  1. //这里是superclass和subclasses两个属性的用法
  3. Person.superclass
  4. // -> null
  5. Person.subclasses.length
  6. // -> 1
  7. Person.subclasses.first() == Pirate
  8. // -> true
  9. Pirate.superclass == Person
  10. // -> true

三个例子几本覆盖了Class类的方法，详细例子请参考：http://prototypejs.org/learn/class-inheritance

posted @ 2009-07-29 16:46  麦飞  阅读(326)  评论(0)  编辑  收藏  举报