重构JS代码：让JS代码平面化

js中的嵌套函数用的很多，很牛叉，那为何要平面化?

易懂（自己及他人）

易修改（自己及他人）

平时Ajax调用写法(基于jQuery)

$.post('url', jsonObj,
                function (data)
                {
                      if(data)
                      {
                           var tips = $.ligerDialog.tip({ title: 'Tip', content: 'Operation successful!' });
                           setTimeout(function () { tips.close(); }, 2000);
                      }
                      else
                      {
                            var tips = $.ligerDialog.tip({ title: 'Tip', content: 'Operation Failed!' });
                            setTimeout(function () { tips.close(); }, 2000);
                      }
                }
        );

缺点是什么？

函数嵌套后，理解起来比较吃力

函数嵌套后，一行函数调用写成了很多行，很容易因为逗号、括号等造成语法 错误

jQuery和liger在应用代码中强耦合，要是以后要更换UI框架，需要进行地毯 式搜索...

加入延迟特性 - Deferred

var ajaxHandler = $.post('url', params);
ajaxHandler.done(checkServerResponse);

var checkServerResponse=function(result)
{
      if(result)
       {
             var tips = $.ligerDialog.tip({ title: 'Tip', content: 

'Operation successful!' });
              setTimeout(function () { tips.close(); }, 2000);
        }
        else
        {
                var tips = $.ligerDialog.tip({ title: 'Tip', content: 

'Operation Failed!' });
                setTimeout(function () { tips.close(); }, 2000);
         }
}

释疑：

   改后的js与先前的没有很大区别：如果js采用了OO方式编写， 再来看这段代码就很清晰了（可以简单的把checkServerResponse理解为一个 private的class方法，这样会很容易理解编写意图）
   要是有多个ajax请求呢？可以写成$.when($.post('url1'), $.post('url2')).done(this.checkServerResponse);类似于合并的意思，并且 checkServerResponse函数的参数是2个，分别对应2个ajax请求的result
   要是有多个后续请求呢？可以写成$.when($.post(url)).then (handler1).then(handler2).done(successHandler).always (alwaysHandler).fail(failHandler);

以上是小编为您精心准备的的内容，在的博客、问答、公众号、人物、课程等栏目也有的相关内容，欢迎继续使用右上角搜索按钮进行搜索函数
， function
， ligerdialog
， operation
， settimeout
， tip
， tips
， jquery.post
重构js
，以便于您获取更多的相关知识。