Jquery~$when_done_then的用法

对于$.ajax请求来说,如果层级比较多,程序看起来会比较乱,而为了解决这种问题,才有了$when...done... fail... then的封装,它将$.ajax这嵌套结构转成了顺序平行的结果,向下面的$.ajax写法,看起来很乱

    $.ajax({
        url: "/home/GetProduct",
        dataType: "JSON",
        type: "GET",
        success: function (data) {
            $.ajax({
                url: "/home/GetProduct",
                dataType: "JSON",
                type: "GET",
                success: function (data) {
                    $.ajax({
                        url: "/home/GetProduct",
                        dataType: "JSON",
                        type: "GET",
                        success: function (data) {
        
                        }
                }
        }

而它实现的功能无非就是外层执行完成后,去执行内层的代码代码,看下面的$.when写法,就清晰多了

    $.when($.ajax({
        url: "/home/GetProduct",
        dataType: "JSON",
        type: "GET",
        success: function (data) {
            alert(JSON.stringify(data));
        }
    })).done(function (data) {
        alert(data[0].Name);
    }).done(function (data) {
        alert(data[1].Name);
    }).fail(function () {
        alert("程序出现错误!");
    }).then(function (data) {
        alert("程序执行完成");
    });

而对于这种ajax的封装,在比较流行的node.js里也需要被看到,这就类似于 方法的回调技术 !

在使用MVVM的KO上,更加得心应手,感觉$.when就是为了Knockoutjs而产生的!

    //MVVM数据绑定
    var MyModel = new model();
    $.when($.ajax({
        url: "/home/GetProduct",
        dataType: "JSON",
        type: "GET",
        success: function (data) {
            MyModel.PeopleList = ko.observableArray(data);//先为对象赋值
        }
    })).done(function (data) {
        ko.applyBindings(MyModel);//再绑定对象
    });

以后我们在进行前端开发时,应该多使用这种顺序的,平行的代码段,而少用嵌套的代码段,这只是大叔个人的见解。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
jQuery 中的 `$.when`,`done` 和 `then` 是一组用于处理异步操作的方法。 `$.when` 方法用于等待一个或多个异步操作完成。它接受任意数量的参数,每个参数都是一个需要等待的异步操作对象。当所有异步操作都完成时,`$.when` 返回一个新的 Deferred 对象。 `done` 方法是 `Deferred` 对象的一个回调函数,它在 `$.when` 返回的新的 Deferred 对象解决时被调用。可以将一个或多个回调函数作为参数传递给 `done` 方法。这些回调函数将在异步操作完成时执行,并且可以在函数内部访问异步操作的结果。 `then` 方法是 `Deferred` 对象的另一个回调函数,它在 `done` 方法调用后执行。可以将一个或多个回调函数作为参数传递给 `then` 方法。这些回调函数将在 `done` 方法的回调函数执行后执行,并且也可以在函数内部访问异步操作的结果。 使用 `$.when`,`done` 和 `then` 方法的典型用例是处理多个异步操作的结果。我们可以在 `$.when` 中传入多个需要等待的异步操作对象,然后在 `done` 或 `then` 方法中分别处理每个异步操作的结果。这样可以确保当所有异步操作都完成时再执行后续的逻辑。 例如,我们可以使用以下代码处理两个异步操作的结果: ``` // 创建两个 Deferred 对象 var deferred1 = $.ajax({ url: 'url1', method: 'GET' }); var deferred2 = $.ajax({ url: 'url2', method: 'GET' }); // 等待两个异步操作完成 $.when(deferred1, deferred2).done(function(result1, result2) { // 处理异步操作的结果 console.log(result1); console.log(result2); }).then(function() { // 执行后续逻辑 console.log('All async operations completed.'); }); ``` 以上代码中,`deferred1` 和 `deferred2` 是两个异步操作对象,分别表示两个 AJAX 请求。我们使用 `$.when` 方法等待这两个异步操作完成,并在 `done` 方法中处理每个异步操作的结果。在 `then` 方法中可以执行其他的逻辑,如打印完成的消息。 总之,`$.when`,`done` 和 `then` 是 jQuery 提供的用于处理异步操作的方法,它们可以帮助我们更方便地管理和处理多个异步操作的结果。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值