使用模块化JS的承诺



我正在尝试应用代码中的模块化JS模式,但是很难实现承诺。我习惯使用"然后"在1行中承诺,但是现在我有了单独的功能,每个功能都在调用服务器并将值返回到另一个功能,我不知道我该怎么做。我很困惑如何使用完成&同时解决。

这是我的代码:

   //I want to call a function, makeLinksObject(), which will call the another function that calls the server
   var formattedObject = makeLinksObject();
   formattedObject.done(function (renderedObject) {
            render(renderObject);
                    })
  function makeLinksObject() {
            //here I want to call another function that will call the server
            var dfd = getLastTimeUpdated();
            var linksArray = [];
            var linksObject = {};
            //get site updated date
            dfd.done(function (dateUpdated) {
                $.each(links, function (index, value) {
                    var linkObject = {};
                    obj.Title = value.Title.toLowerCase();
                    linksArray.push(obj);
                });
                linksObject = {
                    lblcallerId: "some value here"
                    links: linksArray
                }
            }); // end done
            return dfd.resolve(linksObject);
        }
        function getLastTimeUpdated() {
            var modificationUrl = "serverurl"
            dfd = $.ajax({
                url: modificationUrl,
                method: "GET",
                headers: {
                    "accept": "application/json;odata=verbose"
                }
            });
            dfd.done(function(data){
                dfd.resolve(data.d.LastItemModified);
            })
               return dfd.promise(); 
        }

我如何从函数2中使用服务器从服务器返回该值,以及在函数1中使用函数2的结果,然后我可以在函数1中绘制我的html。

当前,我在第二个功能中遇到了错误,并且没有识别我的递延对象。

我考虑过那时会嵌套的代码,但是我想使用模块化代码来组织我的代码。任何帮助,将不胜感激。

$.ajax()返回一个jQuery Promise对象,$.Deferred()是不需要的,可以删除;将.then()替换为.done(),您要返回以外的值以外的值,而不是从$.ajax()返回的原始承诺值,在函数调用和.then()中使用return。注意,您还可以通过将.fail()链接到每个链中的最后一个.then()来包括错误处理到图案

   var formattedObject = makeLinksObject();
   formattedObject
   .done(function(renderedObject) {
     render(renderObject);
   })
   function makeLinksObject() {
     var dfd = getLastTimeUpdated();
     var linksArray = [];
     var linksObject = {};
     return dfd.then(function(dateUpdated) {
       $.each(links, function(index, value) {
         var linkObject = {};
         obj.Title = value.Title.toLowerCase();
         linksArray.push(obj);
       });
       linksObject = {
         lblcallerId: "some value here",
         links: linksArray
       }
     })
     .then(function() {
       return linksObject
     });
   }
   function getLastTimeUpdated() {
     var modificationUrl = "serverurl"
     return $.ajax({
       url: modificationUrl,
       method: "GET",
       headers: {
         "accept": "application/json;odata=verbose"
       }
     })
     .then(function(data) {
       return data.d.LastItemModified;
     })
   }

最新更新