js의 동기화, 폐쇄 및 비동기 요청 조합에 대한 간단한 이해-JS 튜토리얼-php.cn

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

php是最好的语言

풀어 주다： 2018-08-01 11:07:05

원래의

2232명이 탐색했습니다.

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

수신된 배경은 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);
    })
}

로그인 후 복사

# 🎜 🎜#

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

비동기로 변경한 후

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

js의 동기화, 폐쇄 및 비동기 요청 조합에 대한 간단한 이해 ajax 콜백 출력은 동일하며 11 11이 됩니다.

js의 동기화, 폐쇄 및 비동기 요청 조합에 대한 간단한 이해 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);
    })
}

로그인 후 복사

# 🎜🎜#

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

비동기화로 변경한 후 js의 동기화, 폐쇄 및 비동기 요청 조합에 대한 간단한 이해 백그라운드에서 수신되는 데이터가 변경되었으며 0~10은 예상하지 않습니다 # 🎜🎜#

Ajax의 콜백 출력도 11 11이 됩니다.
js의 동기화, 폐쇄 및 비동기 요청 조합에 대한 간단한 이해

순서 ajax 실행 중 for 루프가 실행된 후 i는 11이 됩니다
예상한 효과를 얻으려면 ajax가 실행될 때 i에 대한 참조를 유지해야 합니다 js의 동기화, 폐쇄 및 비동기 요청 조합에 대한 간단한 이해

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)//实参}

로그인 후 복사

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