Class Observer

The Observer class is used to observe and manage changes to an object. It allows for tracking modifications to nested properties, emitting events on changes, and maintaining state consistency. This is particularly useful in applications where state management and change tracking are critical, such as in data-driven interfaces or collaborative applications.

Example

const data = {
  name: 'John',
  age: 30,
  address: {
    city: 'New York',
    zip: '10001'
  }
};

const observer = new Observer(data);

observer.on('name:set', (newValue, oldValue) => {
  console.log(`Name changed from ${oldValue} to ${newValue}`);
});

observer.set('name', 'Jane'); // Logs: Name changed from John to Jane

Hierarchy (view full)

Constructors

constructor

Accessors

suspendEvents

Methods

addEmitter destroy emit get has json latest on once remove removeEmitter set unbind unset

Constructors

constructor

Accessors

suspendEvents

  • get suspendEvents(): boolean

  • Gets whether events are suspended.

    Returns boolean

  • set suspendEvents(value): void

  • Sets whether events are suspended. If true, the observer will not emit events when values are set.

    Parameters

    • value: boolean

    Returns void

Methods

addEmitter

  • addEmitter(emitter): void

  • Adds another emitter. Any events fired by this instance will also be fired on the additional emitter.

    Parameters

    Returns void

destroy

emit

  • emit(name, arg0?, arg1?, arg2?, arg3?, arg4?, arg5?, arg6?, arg7?): Events

  • Emits the specified event, executing all registered listeners for that event with the provided arguments. If events are suspended, the emit operation will be ignored.

    Parameters

    • name: string

      The name of the event to emit.

    • Optionalarg0: any

      The first argument to pass to the event listeners.

    • Optionalarg1: any

      The second argument to pass to the event listeners.

    • Optionalarg2: any

      The third argument to pass to the event listeners.

    • Optionalarg3: any

      The fourth argument to pass to the event listeners.

    • Optionalarg4: any

      The fifth argument to pass to the event listeners.

    • Optionalarg5: any

      The sixth argument to pass to the event listeners.

    • Optionalarg6: any

      The seventh argument to pass to the event listeners.

    • Optionalarg7: any

      The eighth argument to pass to the event listeners.

    Returns Events

    The current instance for chaining.

    Example

    // Register an event listener
    events.on('testEvent', (arg1, arg2) => {
        console.log('Event triggered with arguments:', arg1, arg2);
    });

    // Emit the event
    events.emit('testEvent', 'value1', 'value2');

    // Emit the event with more arguments
    events.emit('testEvent', 'value1', 'value2', 'value3', 'value4');

get

  • get(path, raw?): any

  • Parameters

    • path: string

      Path to the value.

    • Optionalraw: boolean

      TODO.

    Returns any

    The value at the specified path.

has

  • has(path): boolean

  • Query whether the object has the specified property.

    Parameters

    • path: string

      Path to the value.

    Returns boolean

    Returns true if the value is present and false otherwise.

json

  • json(target?): object

  • Parameters

    • Optionaltarget: any

      TODO.

    Returns object

    The current state of the object tracked by the observer.

latest

  • latest(): Observer

  • Returns the latest observer instance. This is important when dealing with undo / redo where the observer might have been deleted and/or possibly re-created.

    Returns Observer

    The latest instance of the observer.

on

  • on(name, fn): EventHandle

  • Registers an event listener for the specified event name. If the event is emitted, the callback function is executed with up to 8 arguments.

    Parameters

    • name: string

      The name of the event to listen for.

    • fn: HandleEvent

      The callback function to be executed when the event is emitted.

    Returns EventHandle

    An EventHandle object that can be used to unbind the event listener.

    Example

    // Register an event listener
    events.on('testEvent', (arg1, arg2) => {
        console.log('Event triggered with arguments:', arg1, arg2);
    });

    // Emit the event
    events.emit('testEvent', 'value1', 'value2');

once

  • once(name, fn): EventHandle

  • Registers a one-time event listener for the specified event name. The callback function is executed the next time the event is emitted, and then automatically unbound.

    Parameters

    • name: string

      The name of the event to listen for.

    • fn: HandleEvent

      The callback function to be executed once when the event is emitted.

    Returns EventHandle

    An EventHandle object that can be used to unbind the event listener before it is triggered.

    Example

    // Register a one-time event listener
    events.once('testEvent', (arg1, arg2) => {
        console.log('Event triggered once with arguments:', arg1, arg2);
    });

    // Emit the event
    events.emit('testEvent', 'value1', 'value2'); // The callback will be called and then unbound.

    // Emit the event again
    events.emit('testEvent', 'value1', 'value2'); // The callback will not be called this time.

remove

  • remove(path, ind, silent?, remote?): boolean

  • Parameters

    • path: string

      Path to the value.

    • ind: number

      Index of the value.

    • Optionalsilent: boolean

      If true, the remove event will not be emitted.

    • Optionalremote: boolean

      TODO.

    Returns boolean

    Returns true if the value was successfully removed and false otherwise.

removeEmitter

set

  • set(path, value, silent?, remote?, force?): boolean

  • Parameters

    • path: string

      Path to the property in the object.

    • value: any

      Value to set.

    • Optionalsilent: boolean

      If true, the change will not be recorded in history.

    • Optionalremote: boolean

      TODO.

    • Optionalforce: boolean

      If true, the value will be set even if it is the same as the current value.

    Returns boolean

    Returns true if the value was successfully set and false otherwise.

unbind

  • unbind(name?, fn?): Events

  • Unbinds an event listener for the specified event name. If a callback function is provided, only that specific listener is removed. If no callback is provided, all listeners for the event are removed. If no event name is provided, all listeners for all events are removed.

    Parameters

    • Optionalname: string

      The name of the event to unbind. If not provided, all events are unbound.

    • Optionalfn: HandleEvent

      The specific callback function to remove. If not provided, all listeners for the event are removed.

    Returns Events

    The current instance for chaining.

    Example

    // Register an event listener
    const callback = (arg1, arg2) => {
        console.log('Event triggered with arguments:', arg1, arg2);
    };
    events.on('testEvent', callback);

    // Unbind the specific event listener
    events.unbind('testEvent', callback);

    // Unbind all listeners for a specific event
    events.unbind('testEvent');

    // Unbind all listeners for all events
    events.unbind();

unset

  • unset(path, silent?, remote?): boolean

  • Parameters

    • path: string

      Path to the value.

    • Optionalsilent: boolean

      If true, the change will not be recorded in history.

    • Optionalremote: boolean

      TODO.

    Returns boolean

    Returns true if the value was successfully unset and false otherwise.

Settings

Member Visibility

On This Page

Constructors
Accessors
Methods