`
cobra
  • 浏览: 50534 次
最近访客 更多访客>>
社区版块
存档分类
最新评论

Class.create Vs Object.extend

阅读更多

Prototype在1.6之前的实现一个继承的操作的时候都是采用Object.extend的方式。Object.extend的实现原理是先创建出父类的对象并将子类中的方法复制到这个对象中去,这样做可以比较轻松的实现一个子类到父类的upcasting。但是这样也会存在一个问题,就是子类无法在自己的构造函数中调用父类的构造函数,也就是说无法实现super这样的操作。

1.6以前的Object.extend的实现代码:

  1. Object.extend = function(destination, source) {
  2. for (var property in source) {
  3. destination[property] = source[property];
  4. }
  5. return destination;
  6. }

1.6的Prototype中改写了关于继承的实现,Class.create新增加了一种模式的调用,Class.create([BassClass], {});

Prototypejs.org提供的Class.create新的实例:

  1. var Animal = Class.create({
  2. initialize: function(name, sound) {
  3. this.name = name;
  4. this.sound = sound;
  5. },
  6.  
  7. speak: function() {
  8. alert(this.name + " says: " + this.sound + "!");
  9. }
  10. });
  11.  
  12. // subclassing Animal
  13. var Snake = Class.create(Animal, {
  14. initialize: function($super, name) {
  15. $super(name, 'hissssssssss');
  16. }
  17. });
  18.  
  19. var ringneck = new Snake("Ringneck", "hissssssss");
  20. ringneck.speak();
  21.  
  22. //-> alerts "Ringneck says: hissssssss!"
  23.  

在这个实例中我们看到了$super这个新增加的函数,通过$super方法我们可以调用父类的方法。再来看一下最新的Prototype 1.6中的Class.create的实现:

  1. /* Based on Alex Arnell's inheritance implementation. */
  2. var Class = {
  3. create: function() {
  4. var parent = null, properties = $A(arguments);
  5. if (Object.isFunction(properties[0]))
  6. parent = properties.shift();
  7.  
  8. function klass() {
  9. this.initialize.apply(this, arguments);
  10. }
  11.  
  12. Object.extend(klass, Class.Methods);
  13. klass.superclass = parent;
  14. klass.subclasses = [];
  15.  
  16. if (parent) {
  17. var subclass = function() { };
  18. subclass.prototype = parent.prototype;
  19. klass.prototype = new subclass;
  20. parent.subclasses.push(klass);
  21. }
  22.  
  23. for (var i = 0; i < properties.length; i++)
  24. klass.addMethods(properties[i]);
  25.  
  26. if (!klass.prototype.initialize)
  27. klass.prototype.initialize = Prototype.emptyFunction;
  28.  
  29. klass.prototype.constructor = klass;
  30.  
  31. return klass;
  32. }
  33. };

可以看到最新的继承实现将父类暂存中superclass,这样在子类中通过$super调用父类的方法时,实际上调用的是this.superclass中的方法。

在开发Glove.Widget时候曾经就为没有super方法犯愁过,现在1.6有了新的继承模式Glove.Widget就不用像以前那样丑陋的实现super的功能了。明天开始考虑Glove.Widget基于Prototype1.6的重构。

分享到:
评论
1 楼 jeho0815 2011-03-04  
高手。。。

相关推荐

    前端开源库-class-extend

    子类可以通过调用`extend`方法从基类派生,这与JavaScript中的`Object.create`或`prototype`机制相似,但提供了更友好的API。 2. **方法重写与继承**:子类可以重写基类的方法,同时仍然保留对基类方法的访问。这种...

    JavaScript 继承详解(六)

    总的来说,Prototype.js通过提供`Class.create`和`Object.extend`等工具,使得JavaScript中的继承变得更加易于理解和使用。这种继承机制使得开发者能够创建复杂的对象层次结构,实现了类的概念,并有效地复用了代码...

    Prototype-3.pdf

    综上所述,Prototype框架为JavaScript提供了更强大的面向对象编程支持,通过`Class.create`和`Object.extend`等方法改进了JavaScript的类和继承机制。这对于希望利用JavaScript进行复杂Web开发的开发者来说是一个...

    Extend

    在JavaScript中,对象扩展可以通过多种方式实现,如使用原型链(__proto__),Object.create(),ES6的类继承(class extends)以及使用Object.assign()等方法。 - **原型链**:通过修改对象的原型(__proto__)...

    Prototype(注解)

    - `Class.create()` 方法详解 - 对象扩展 `Object.extend` - 函数绑定 `Function.prototype.bind` 3. **实用工具方法** - `Object.inspect` 方法介绍 - `Function.prototype.bindAsEventListener` 方法解析 #...

    prototype.js 1.4 原代码阅读

    在本篇文章中,我们将对 `Prototype.js` 1.4 版本的部分源码进行深入分析,重点研究 `Class.create()` 方法。 #### 二、`Class.create()` 方法详解 ##### 2.1 方法介绍 `Class.create()` 方法用于创建一个新的类...

    Prototype使用指南之base.js

    base.js中包含下面的内容 类的创建与继承: Class.create(): 创建一个类,例如 person=Class.create() Object.extend(destination, source): 把source中方法属性copy到destination(使用for propertyin source),...

    Prototype Enumerable对象 学习第1/2页

    var YourObject = Class.create(); Object.extend(YourObject.prototype, Enumerable); Object.extend(YourObject.prototype, { initialize: function() { /* 构造函数代码 */ }, _each: function(iterator) { /* ...

    一个JS类(收藏)

    此外,Prototype.js提供了一些实用的工具函数,如`Object.extend()`用于合并对象,`Array.include()`用于添加元素到数组,以及`Element`和`Selector`等对DOM操作的便利方法。这些工具极大地方便了开发者进行日常的...

    类之Prototype.js学习

    - 使用`Class.create()`方法可以轻松地创建一个新的类。例如: ```javascript var Person = Class.create(); ``` - 创建后的类必须包含`initialize`方法,该方法充当构造函数的角色。它可以接受参数,类似于...

    prototype 1.3 源码解读

    return Object.extend.apply(this, [this, object]); }; ``` - **`Object.prototype.extend`**:该方法使得任何对象都可以直接使用 `extend` 方法来自身扩展其他对象的属性。这是一种链式调用的方式,使得代码更加...

    prototype.js 1.6

    - **类继承**:通过 `Class.create()` 创建新类,并利用 `Class.inherit()` 或 `Object.extend()` 实现类继承。 - **DOM 操作**:利用 `Element` 对象上的方法,如 `Element.update()` 和 `Element.insert()`,可以...

    【Prototype 1.4.0】源码解读----全文注释版

    `Class.create()`返回的构造函数类似于C#或JAVA中的类定义,可以理解为继承自`Object`基类。 3. **Abstract对象**:`Abstract`是一个空对象,主要用于定义抽象类。通过将类定义放在`Abstract`下,可以明确区分抽象...

    详解Javascript继承的实现

    为解决这些问题,我们可以探索其他继承策略,比如使用`Object.create()`、ES6的类或继承库,如`_.extend()`(Lodash)、`inherit()`(Prototype.js)等。这些库通常提供更高效、更简洁的继承机制。 `Object.create...

    prototype1.6.0源码解读.js

    - **方法扩展**:使用 `Object.extend` 方法将 `Class.Methods` 中的方法复制到 `klass` 对象上。 - **初始化方法**:如果 `initialize` 方法未被定义,则使用 `Prototype.emptyFunction` 作为默认初始化方法。 - **...

    prototype 学习笔记整理

    本文将深入探讨`prototype`的核心概念、使用方式以及与之相关的`Class.create()`和`Object.extend()`两个重要方法。 首先,`prototype`是每个构造函数(function)的一个属性,用于定义实例对象的共享属性和方法。...

    prototype.js中文手册

    3. **对象扩展**:Prototype.js 基于JavaScript原型链实现类和对象的继承,提供了`Object.extend()` 和 `Class.create()` 方法,使得JavaScript具备更强大的面向对象编程能力。 4. **函数工具**:内置了一系列实用...

Global site tag (gtag.js) - Google Analytics