js의 동기화, 폐쇄 및 비동기 요청 조합에 대한 간단한 이해

먼저 동기 요청을 살펴보겠습니다

수신된 배경은 0~10
ajax 콜백 출력도 0~10

for (var index = 0; index <= 10; index++) {
    $.ajax({
        async: false,//同步
        url: &#39;/HelloWorld&#39;,
        type: &#39;POST&#39;,
        dataType: &#39;html&#39;,
        data: {index: index}
    }).done(function () {
        console.log(index);
    })
}

# 🎜 🎜#

비동기로 변경한 후

백그라운드에서 수신된 데이터가 변경되어 예상되지 않습니다. 0~10 #🎜 🎜#

ajax 콜백 출력은 동일하며 11 11이 됩니다.

ajax 실행 후 for 루프가 순차적으로 실행되면 i는 11이 됩니다

예상한 효과를 얻으려면 ajax 실행 중에 i에 대한 참조를 유지해야 합니다

for (var index = 0; index <= 10; index++) {
    (function (num) {//形参
        $.ajax({
            async: true,//异步
            url: &#39;/HelloWorld&#39;,
            type: &#39;POST&#39;,
            dataType: &#39;html&#39;
        })
            .done(function () {
                console.log(num);
            })
    })(index)//实参}

이런 식으로 백그라운드에서 수신된 값은 Combined with 프론트엔드에서 출력되는 값은 일관됩니다

동기화 요청을 먼저 살펴보겠습니다

수신된 백그라운드는 0~10입니다

ajax 콜백 출력도 0~10입니다

for (var index = 0; index <= 10; index++) {
    $.ajax({
        async: false,//同步
        url: &#39;/HelloWorld&#39;,
        type: &#39;POST&#39;,
        dataType: &#39;html&#39;,
        data: {index: index}
    }).done(function () {
        console.log(index);
    })
}

# 🎜🎜#

비동기화로 변경한 후백그라운드에서 수신되는 데이터가 변경되었으며 0~10은 예상하지 않습니다 # 🎜🎜#

Ajax의 콜백 출력도 11 11이 됩니다.

순서 ajax 실행 중 for 루프가 실행된 후 i는 11이 됩니다
예상한 효과를 얻으려면 ajax가 실행될 때 i에 대한 참조를 유지해야 합니다

for (var index = 0; index <= 10; index++) {
    (function (num) {//形参
        $.ajax({
            async: true,//异步
            url: &#39;/HelloWorld&#39;,
            type: &#39;POST&#39;,
            dataType: &#39;html&#39;
        })
            .done(function () {
                console.log(num);
            })
    })(index)//实参}

이런 식으로 값은 백그라운드에서 수신된 값은 프런트 데스크에서 출력된 값과 비교할 수 있습니다. 값은 일관됩니다

관련 기사:

동기식 방법 및 차이점 요약 및 js_javascript 기술의 비동기 처리

#🎜🎜 #

ajax 동기 요청과 비동기 요청의 차이점 분석

관련 동영상:

Qianfeng 교육 PHP 비동기 통신 프레임워크 Swoole 해석 비디오 튜토리얼

위 내용은 js의 동기화, 폐쇄 및 비동기 요청 조합에 대한 간단한 이해의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!