복붙노트

[JQUERY] ) ($ .when에 Deferreds의 배열에 전달

JQUERY

) ($ .when에 Deferreds의 배열에 전달

해결법


  1. 1.그래서 당신이 필요로하는이 경우, 일반적으로 그들을 Function.prototype.apply의를 사용하여 별도의 매개 변수로 기대하는 모든 기능에 값의 배열을 전달하려면 :

    그래서 당신이 필요로하는이 경우, 일반적으로 그들을 Function.prototype.apply의를 사용하여 별도의 매개 변수로 기대하는 모든 기능에 값의 배열을 전달하려면 :

    $.when.apply($, my_array).then( ___ );
    

    http://jsfiddle.net/YNGcm/21/ 참조

    ES6에서는 대신 ... 확산 연산자를 사용할 수 있습니다 :

    $.when(...my_array).then( ___ );
    

    당신은 그 때는 핸들러가 필요합니다 얼마나 많은 형식 매개 변수를 미리 알 것 같지 이후 각각의 경우에, 그 핸들러는 각 약속의 결과를 검색하기 위해 인수 배열을 처리해야합니다.


  2. 2.(감사합니다!) 위의 해결 방법이 제대로 jQuery를 호출하기 때문에의 연기 해결 () 메소드에 제공된 개체를 다시 얻기의 문제를 해결 완료 ()와 () 개별 매개 변수가 아닌 배열 콜백을 실패하지 않습니다. 우리가 인수를 사용하는 것을 의미 사이비 배열을 추한 deferreds의 배열에 의해 반환 된 모든 해결 / 거부 개체를 얻을 :

    (감사합니다!) 위의 해결 방법이 제대로 jQuery를 호출하기 때문에의 연기 해결 () 메소드에 제공된 개체를 다시 얻기의 문제를 해결 완료 ()와 () 개별 매개 변수가 아닌 배열 콜백을 실패하지 않습니다. 우리가 인수를 사용하는 것을 의미 사이비 배열을 추한 deferreds의 배열에 의해 반환 된 모든 해결 / 거부 개체를 얻을 :

    $.when.apply($,deferreds).then(function() {
         var objects=arguments; // The array of resolved objects as a pseudo-array
         ...
    };
    

    우리가 deferreds의 배열에 전달하기 때문에, 결과의 배열을 다시 얻을 좋을 것이다. 우리가에 Array.sort 같은 방법을 사용할 수 있도록 그것은 대신 의사 배열의 실제 배열을 다시 얻을 좋을 것이다 ().

    여기에 솔루션은 when.js의 when.all () 메소드가 주소 이러한 문제에서 영감 :

    // Put somewhere in your scripting environment
    if (typeof jQuery.when.all === 'undefined') {
        jQuery.when.all = function (deferreds) {
            return $.Deferred(function (def) {
                $.when.apply(jQuery, deferreds).then(
                    function () {
                        def.resolveWith(this, [Array.prototype.slice.call(arguments)]);
                    },
                    function () {
                        def.rejectWith(this, [Array.prototype.slice.call(arguments)]);
                    });
            });
        }
    }
    

    지금 당신은 단순히 deferreds / 약속의 배열에 전달하고 그래서 같이 콜백에서 해결 / 거부 객체의 배열을 다시 얻을 수 있습니다 :

    $.when.all(deferreds).then(function(objects) {
        console.log("Resolved objects:", objects);
    });
    

  3. 3.당신은 당신의 배열에 때 방법을 적용 할 수 있습니다 :

    당신은 당신의 배열에 때 방법을 적용 할 수 있습니다 :

    var arr = [ /* Deferred objects */ ];
    
    $.when.apply($, arr);
    

    어떻게 jQuery를 Deferreds의 배열과 함께 작동합니까?


  4. 4.다중 병렬 AJAX 호출을 호출 할 때, 당신은 각각의 응답을 처리하기위한 두 가지 옵션이 있습니다.

    다중 병렬 AJAX 호출을 호출 할 때, 당신은 각각의 응답을 처리하기위한 두 가지 옵션이 있습니다.

    함수 ajaxRequest (capitalCity) { {($ 아약스를 반환 URL : 'https://restcountries.eu/rest/v1/capital/'+capitalCity, 성공 : 함수 (대응) { }, 오류 : 함수 (대응) { 을 console.log ( "오류") } }); } () {(기능 $ var에 capitalCities = [ '델리', '베이징', '워싱턴', '도쿄', '런던']; $ ( '# 자본') 텍스트 (capitalCities).; 기능 getCountryCapitals () {// 여러 병렬 아약스 요청을 VAR 약속 = []; 위한 VAR (I = 0, L이 = capitalCities.length을 나는

    수도 도시 <스팬 ID = "대문자">

    각각의 나라의 기본 이름 : <스팬 ID = "국가">


  5. 5..when.apply $을 필요로하지 않는 간단한 대안, 또는 배열로 여러 병렬 약속에 대한 하나의 약속을 생성하기 위해 다음과 같은 패턴을 사용할 수 있습니다 :

    .when.apply $을 필요로하지 않는 간단한 대안, 또는 배열로 여러 병렬 약속에 대한 하나의 약속을 생성하기 위해 다음과 같은 패턴을 사용할 수 있습니다 :

    promise = $.when(promise, anotherPromise);
    

    EG

    function GetSomeDeferredStuff() {
        // Start with an empty resolved promise (or undefined does the same!)
        var promise;
        var i = 1;
        for (i = 1; i <= 5; i++) {
            var count = i;
    
            promise = $.when(promise,
            $.ajax({
                type: "POST",
                url: '/echo/html/',
                data: {
                    html: "<p>Task #" + count + " complete.",
                    delay: count / 2
                },
                success: function (data) {
                    $("div").append(data);
                }
            }));
        }
        return promise;
    }
    
    $(function () {
        $("a").click(function () {
            var promise = GetSomeDeferredStuff();
            promise.then(function () {
                $("div").append("<p>All done!</p>");
            });
        });
    });
    

  6. 6.나는 $ .each를 사용하여 다른 하나를 제안합니다 :

    나는 $ .each를 사용하여 다른 하나를 제안합니다 :


  7. 7.ES6에 액세스 할 수있는 거 transpiling 당신이 경우, 당신은 특히 이산 인수, 다만 방법 $ .when ()을 필요로 물체의 각 반복 가능한 항목을 적용 확산 구문을 사용할 수 있습니다.

    ES6에 액세스 할 수있는 거 transpiling 당신이 경우, 당신은 특히 이산 인수, 다만 방법 $ .when ()을 필요로 물체의 각 반복 가능한 항목을 적용 확산 구문을 사용할 수 있습니다.

    $.when(...deferreds).done(() => {
        // do stuff
    });
    

    MDN 링크 - 확산 구문


  8. 8.당신이 AngularJS와 또는 Q 약속 라이브러리의 일부 변형을 사용하는 경우, 당신은 .ALL () 메소드로 해결할 수있는 문제가이 정확한 문제가 있습니다.

    당신이 AngularJS와 또는 Q 약속 라이브러리의 일부 변형을 사용하는 경우, 당신은 .ALL () 메소드로 해결할 수있는 문제가이 정확한 문제가 있습니다.

    var savePromises = [];
    angular.forEach(models, function(model){
      savePromises.push(
        model.saveToServer()
      )
    });
    
    $q.all(savePromises).then(
      function success(results){...},
      function failed(results){...}
    );
    

    전체 API를 참조하십시오

    https://github.com/kriskowal/q/wiki/API-Reference#promiseall

    https://docs.angularjs.org/api/ng/service/$q


  9. 9.내가 각 루프에 게시 한 후 아약스로부터받은 번호에서 일부 필드에서 HTML 마크 업을 설정했다 어디 매우 비슷한 경우가 있었다. 나는 다음 전체 분야에서 이러한 필드와 장소의 (지금 업데이트) 값의 합을 할 필요가 있었다.

    내가 각 루프에 게시 한 후 아약스로부터받은 번호에서 일부 필드에서 HTML 마크 업을 설정했다 어디 매우 비슷한 경우가 있었다. 나는 다음 전체 분야에서 이러한 필드와 장소의 (지금 업데이트) 값의 합을 할 필요가 있었다.

    따라서 문제는 모든 숫자의 합을하려고했지만 데이터가 비동기 아약스 호출에서 또 다시 도착하지했다고했다. 나는 코드를 재사용 할 수있는 몇 가지 기능이 기능을 완료하는 데 필요한. 그때 가서 완전히 업데이트 DOM에 몇 가지 물건을하기 전에 내 외부 기능은 데이터를 기다립니다.

        // 1st
        function Outer() {
            var deferreds = GetAllData();
    
            $.when.apply($, deferreds).done(function () {
                // now you can do whatever you want with the updated page
            });
        }
    
        // 2nd
        function GetAllData() {
            var deferreds = [];
            $('.calculatedField').each(function (data) {
                deferreds.push(GetIndividualData($(this)));
            });
            return deferreds;
        }
    
        // 3rd
        function GetIndividualData(item) {
            var def = new $.Deferred();
            $.post('@Url.Action("GetData")', function (data) {
                item.html(data.valueFromAjax);
                def.resolve(data);
            });
            return def;
        }
    
  10. from https://stackoverflow.com/questions/5627284/pass-in-an-array-of-deferreds-to-when by cc-by-sa and MIT license