Backbone.js listenToOnce Event

Last Updated : 26 May, 2022

Backbone.js listenTo Event notifies an object to listen to a particular event on another object. The benefit of using this form is that listenTo permits the object to keep the track of the events, & later, they are removed all at once. When an event occurs, the callback function will be called with the object as context.

Backbone.js Event listenToOnce() is similar to the listenTo() event with the only difference being that the callback function is called only once before it is removed.

Syntax:

object.listenToOnce(other, event, callback)

Parameter Values:

other: This parameter value is used to define the name of the other object.
event: This parameter value is used to bind an object with an event.
callback: This parameter value is used to make a reference to the code which is then called with object as context.

Example: This example describes the Event listenToOnce() in BackboneJS.

HTML

<!DOCTYPE html> 
<html> 
  
<head> 
    <title>BackboneJS Event listenToOnce</title> 
    <script src= 
"https://code.jquery.com/jquery-2.1.3.min.js" 
            type="text/javascript"> 
    </script> 
    <script src= 
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js" 
            type="text/javascript"> 
    </script> 
    <script src= 
"https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js" 
            type="text/javascript"> 
    </script> 
</head> 
  
<body> 
    <h1 style="color: green;"> 
          GeeksforGeeks 
      </h1> 
      
      <h3>BackboneJS Event listenToOnce</h3> 
      
      <script type="text/javascript"> 
        var gfgVar1 = _.extend({ 
            value: 'Data Structures & Algorithms', 
        }, Backbone.Events); 
        var gfgVar2 = _.extend({ 
            value: 'Web Technology', 
        }, Backbone.Events); 
        let listenVar = function() { 
            document.write(`</br>This is ` + this.value + ` course.`); 
        }; 
        gfgVar1.listenToOnce(gfgVar1, 'listenVar', listenVar); 
        gfgVar2.listenToOnce(gfgVar1, 'listenVar', listenVar); 
        gfgVar1.trigger('listenVar'); 
    </script> 
</body> 
    
</html>

Here, the _.extend() function is used to create a copy of all of the properties of the source objects over the destination object and return the destination object.

Output: