Compartir a través de


Crear una clase de componente de cliente utilizando el modelo de prototipo

Actualización: noviembre 2007

En este tema se muestra cómo crear una clase de componente de cliente de AJAX en ASP.NET. Una clase de cliente de AJAX, que incluye componentes base, comportamientos y clases de control, se define en ECMAScript (JavaScript) mediante el modelo de prototipo y la notación JSON. En la notación JSON, todos los miembros de prototipo se separan con comas. No hay ninguna coma después del último miembro del prototipo.

El ejemplo siguiente define una clase de componente de cliente simple que no tiene ninguna funcionalidad práctica. Muestra cómo definir una clase que procede de la clase base Component mediante el modelo de prototipo.

// Declare a namespace.
Type.registerNamespace("Samples");

// Define a simplified component.
Samples.SimpleComponent = function()
{
    Samples.SimpleComponent.initializeBase(this);

    // Initialize arrays and objects in the constructor
    // so they are unique to each instance.
    // As a general guideline, define all fields here. 
    this._arrayField = [];
    this._objectField = {};
    this._aProp = 0;
}
// Create protytype.
Samples.SimpleComponent.prototype = 
{
    // Define set and get accessors for a property.
    Set_Aprop: function(aNumber)
    {
        this._aProp = aNumber;
    },

    Get_Aprop: function()
    {
        return this._aProp;
    },

    // Define a method.
    DoSomething: function()
    { 
       alert('A component method was called.');
    }
} // End of prototype definition.


// Register the class as derived from Sys.Component.
Samples.SimpleComponent.registerClass('Samples.SimpleComponent', Sys.Component);

Los pasos siguientes describen cómo definir una clase de cliente AJAX de ASP.NET, incluidas las clases de control:

  1. Si la clase forma parte de un espacio de nombres, regístrelo llamando al método Type.registerNamespace.

  2. Defina la función de constructor de clase y su espacio de nombres en el nombre de la función de constructor. En el constructor, declare todos los campos privados. Se recomienda declarar las variables privadas del constructor como campos de instancia mediante el puntero this. Por convención, los campos privados se denominan con un carácter de subrayado como prefijo.

    Samples.SimpleComponent = function()
    {
        Samples.SimpleComponent.initializeBase(this);
    
        this._arrayField = [];
        this._objectField = {};
        this._aProp = 0;
    }
    
  3. Definir el prototipo de la clase. En el prototipo, defina todos los métodos públicos y privados. Esto incluye los métodos y eventos del descriptor de acceso de la propiedad.

    Se recomienda definir todos los campos en el constructor. Se consigue una ganancia de rendimiento muy pequeña definiendo los campos en el prototipo en lugar de en la función de constructor. Sin embargo, no todos los tipos de campo se pueden declarar en el prototipo. Por ejemplo, los tipos de campo Array y Object se deben declarar en el constructor para que sean únicos de cada instancia, en lugar de hacer referencia a ellos en el prototipo de todas las instancias. Esto evita que se actualice involuntariamente una propiedad de componente de lo que debería ser una instancia, pero que en su lugar se actualiza el valor de todas las instancias.

    Nota:

    Haga referencia siempre a los miembros en el prototipo mediante el puntero this. El puntero this ofrece ventajas de rendimiento porque el espacio de trabajo utiliza menos memoria.

  4. Registre la clase llamando al método Type.registerClass. Para obtener más información sobre cómo utilizar el método Type.registerClass para registrar una clase y declarar sus interfaces y clase base, vea Type.registerClass (Método).

Vea también

Tareas

Crear componentes de cliente no visuales personalizados