Observables: KnockoutJS

INTRODUCCIÓN A LOS OBSERVABLES:
propiedad de objeto especial que cambia dinámicamente a través de la interacción del usuario, puede notificar a los suscriptores sobre cambios y detectar dependencias automáticamente.

CARACTERÍSTICAS:
Observables de lectura y escritura
1. LEER: AppViewModel.yourName();
2. ESCRIBIR – AppViewModel.yourName(‘Diana’);
3. ESCRIBIR MÚLTIPLES – AppViewModel.yourName(‘Diana’).yourAge(25);

DEFINIENDO UN OBSERVABLE (CON EJEMPLOS):

1. Creating an Observable Variable - 

        var myObservable = ko.observable();
        myObservable('Hello');
        alert(myObservable());

   Assign ko.observable function to a variable. Knockout then converts the variable 
   into a function and tracks when the value changes to notify the UI elements 
   associated with the variable.

2. Creating an Observable Array - 

        var myObservableArray = ko.observableArray([]);
        myObservableArray.push('Hello');

   Array is instantiated as an empty array, passing square brackets in the 
   constructor.
   When the elements are added or removed from the array, Knockout notifies 
   elements that are subscribed to the notifications.

3. Creating a Computed Observable - 

         self.firstName = ko.observable('Steve');
         self.lastName = ko.observable('Kennedy');
         self.fullName = ko.computed(function() {
         return 'Hello ' + self.firstName() + ' ' + self.lastName(); });

   When the ViewModel is bounded to the Knockout, the computed function is executed 
   then, it subscribes to any change events to that variable and hence Knockout 
   updates the computed variable as well. 

VENTAJAS:

  • Pueden detectar dependencias automáticamente.
  • Pueden notificar a los suscriptores sobre los cambios.

Publicación traducida automáticamente

Artículo escrito por saumyasaxena2730 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *