Saturday, 16 June 2018

Callbacks VS Deferred

Callback approach

With callback approach you declare your function like this
function getListData(listTitle,success,error)
{
    var context = SP.ClientContext.get_current();
    var web = context.get_web();
    var list = web.get_lists().getByTitle(listTitle);
    var items = list.getItems(SP.CamlQuery.createAllItemsQuery());

    context.load(items);
    context.executeQueryAsync(
        function() {
          success(items);           
        },
        error
    );
}
Usage
getListData('Documents',
         function(items){
            console.log('Items count: ' + items.get_count());
         },
         function(sender,args){
            console.log('An error occured while retrieving list items:' + args.get_message());
});

Deferred approach

Deferred approach is based on a Promises pattern, please refer this article for details about the usage of Promises with CSOM
A deferred - is a pattern that returns an object immediately from an asynchronous call
function getListData(listTitle,success,error)
{
    var dfd = $.Deferred(function () {
      var context = SP.ClientContext.get_current();
      var web = context.get_web();
      var list = web.get_lists().getByTitle(listTitle);
      var items = list.getItems(SP.CamlQuery.createAllItemsQuery());

      context.load(items);
      context.executeQueryAsync(
        function() {
           dfd.resolve(items);           
        },
        function (sender, args) {
           dfd.reject(args);
        }
      );
    });
    return dfd.promise();   
}
Usage
getListData('Documents').then(function(items){
    console.log('Items count: ' + items.get_count());
});

No comments:

Post a Comment