Funciones personalizadas

Para disfrutar de más flexibilidad, puede crear funciones JavaScript personalizadas para manipular datos en las páginas y las vistas.
  • En una página, defina la función JavaScript personalizada en un HTML personalizado, dentro de las etiquetas <script> .
  • En una vista, defina las funciones JavaScript personalizadas en el editor de JavaScript en línea, en Comportamiento.

Utilización de las palabras clave this y page

En el JavaScript de una vista, la palabra clave this utiliza el ámbito de contexto de ejecución global inicial, que significa que this hace referencia a la propia vista y también puede hacer referencia a cualquier vista anidada dentro de ella.

En el ejemplo siguiente, el formulario de inicio de sesión tiene un texto y una vista de contraseña definidos en la página, con los ID de control y. Observe cómo se utiliza this en el JavaScript en línea. La función se define en el contexto de la vista esta . Lo mismo se aplica a las variables definidas en la función.

La palabra clave page se puede utilizar en un HTML personalizado o en el JavaScript en línea de una vista. Page hace referencia a la vista superior de la página, lo que significa que se puede acceder a las vistas de la página y también a las vistas anidadas en ellas. En el caso de las vistas anidadas, es necesario definir las vías de acceso. Por ejemplo, si ha intentado acceder al ID de control en la vista a nivel de página, especificaría la vía de acceso como se muestra a continuación:

Observe cómo este método de definir una función no utiliza una palabra clave que preceda al nombre de la función, ya que la función no es ambigua en el nivel de página. Además, tenga en cuenta cómo se utiliza la palabra clave page en lugar de this, y la vía de acceso que había que definir en la función. En el ejemplo, es el ID de control de la vista y es el ID de control de texto.

Llamada a funciones personalizadas

Tras haber definido una función mediante uno de los métodos descritos anteriormente, es posible acceder a dicha función mediante los manejadores de sucesos de cualquier vista. Para llamar a una función, utilice o en las opciones de configuración del manejador de sucesos. En el ejemplo siguiente, la función personalizada se añade al manejador de sucesos de un botón.

Si una función se define a más niveles, por ejemplo, tanto en la página como en la vista, la versión que se llama es la más cercana a la vista. En nuestro ejemplo, debido a que se define tanto a nivel de página como de vista, la versión a la que se llama es la definida en la propia vista. Las funciones definidas en el mismo nivel que la llamada se buscan primero, y luego la búsqueda asciende de forma secuencial por los niveles hasta encontrar la función definida.

En una vista compuesta, se prefieren funciones definidas para la vista definida a funciones same-name definidas en un HTML personalizado o un recuadro de contenido en la página. También, si hay una vista intermedia con un recuadro de contenido que tenga la función con el mismo nombre, se llama a la función de la vista intermedia en lugar de a la función del padre real. La vista de hojas no sabe si el recuadro de contenido tiene una función. Si se llama a la función equivocada, no funciona. Este comportamiento puede causar problemas si, por ejemplo, un desarrollador utiliza un kit de herramientas listo para usar que incluya, por accidente, la vista con el recuadro de contenido que tenga la función con el mismo nombre.
Importante: Para evitar conflictos o conflictos de nombres, utilice nombres de función exclusivos añadiendo prefijos o sufijos a las funciones definidas en una vista compuesta.

Creación de funciones personalizadas con parámetros

Una función personalizada también se puede pasar en argumentos, por lo que es reutilizable en otros tipos de vistas. Un método utilizado habitualmente en muchas vistas es setLabel. Puede crear una sola función con un parámetro.

Se ha proporcionado el parámetro a la función changeLabel . Luego puede llamar a un método en ese control. En este caso, se ha llamado al método setLabel para cambiar la etiqueta. Para llamar a la función changeLabel, puede llamarla desde uno de los eventos de una vista.

Se ha añadido una vista de texto, que llama a la función changeLabel desde el suceso. La función no necesita que se pase ningún argumento, ya que la vista del control siempre se pasa como el primer argumento. Siempre que la vista tenga el método llamado en la función personalizada dicha función personalizada funcionará con varios tipos de vistas.

Para obtener más información sobre los métodos disponibles, consulte API JavaScript de kit de herramientas de interfaz de usuario.