> 웹 프론트엔드 > 프런트엔드 Q&A > Ajax는 기본적으로 동기식인가요, 비동기식인가요?

Ajax는 기본적으로 동기식인가요, 비동기식인가요?

青灯夜游
풀어 주다: 2022-01-17 16:18:04
원래의
5334명이 탐색했습니다.

ajax는 기본적으로 비동기 제출을 사용합니다. AJAX는 async 값에 따라 동기 "false"와 비동기 "true"로 구분되며 기본적으로 비동기 값은 true(비동기 제출)입니다. 이것의 장점은 부분 새로 고침을 통해 사용자 경험을 향상시키는 동시에 리소스를 절약하고 데이터베이스에 대한 부담을 줄일 수 있다는 것입니다.

Ajax는 기본적으로 동기식인가요, 비동기식인가요?

이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.

Ajax의 기본 제출 방법은 비동기 제출입니다. 이 방법의 장점은 부분 새로 고침을 통해 사용자 경험을 향상시키는 동시에 리소스를 절약하고 데이터베이스에 대한 부담을 줄일 수 있다는 것입니다.

AJAX는 async의 값에 따라 동기(async = false)와 비동기(async = true)로 구분됩니다.

$.ajax({ 
        type: "post", 
       url: "path", 
       cache:false, 
       async:false, 
        dataType: ($.browser.msie) ? "text" : "xml", 
         success: function(xmlobj){ 
                      function1(){};
        } 
});
 function2(){};
로그인 후 복사

기본적으로 async는 true(비동기 제출)입니다.

동기화로 변경하는 방법은 async의 기본값을 false로 변경하는 것인데, 이는 대개 true이거나 작성되지 않습니다. false로 변경하면 ajax의 기능이 손실됩니다.

1. 동기 요청이란 무엇입니까? (false)

동기 요청은 현재 요청이 발행된 후에는 요청이 완료되고 후속 요청 전에 데이터가 반환될 때까지 기다려야 함을 의미합니다. 코드가 실행되는데, 이는 대기할 때 다음 사람이 인계받기 전에 앞 사람이 자신의 업무 처리를 마친 것과 같습니다. 즉, JS 코드가 현재 AJAX에 로드되면 페이지의 모든 코드가 로드를 중지하고 페이지는 정지된 애니메이션 상태가 됩니다. AJAX가 완료되면 다른 코드가 계속 실행됩니다. 코드와 페이지는 정지된 애니메이션 상태를 해제합니다(즉, ajax가 데이터를 수신한 후 반환되면 다음 함수 2)가 실행됩니다.

2. 비동기 요청이란 무엇입니까? (true)

비동기 요청은 요청을 보내는 동안 브라우저가 계속해서 모든 작업을 수행할 수 있음을 의미하며 요청을 보내는 것은 페이지 로딩과 사용자 작업에 영향을 미치지 않습니다. 와 동일합니다. 두 라인 모두 서로 영향을 주지 않고 각자의 방식으로 진행됩니다.

일반적으로 기본값은 true, 비동기입니다. 비동기식 요청은 사용자 경험에 전혀 영향을 미치지 않습니다. 요청이 길거나 짧더라도 사용자는 페이지의 다른 콘텐츠를 작업하는 데 집중하고 있으며 기다리고 싶지 않습니다.

동기식과 비동기식의 차이점은 무엇인가요?

비동기식: 비동기식 모드에서는 AJAX를 사용하여 요청을 보낸 후 실행해야 할 코드가 있을 수 있습니다. 현재로서는 여러 가지 이유로 인해 서버가 요청에 응답하지 않을 수 있지만 비동기 실행을 사용하기 때문에 AJAX 요청 코드가 포함된 모든 함수의 나머지 코드는 계속 실행됩니다. 처리를 위해 요청 결과를 다른 JS 함수에 넘겨주면 동시에 실행되는 두 개의 스레드와 같습니다.

동기화: 동기 모드에서는 AJAX를 사용하여 요청을 보낸 후에도 나중에 실행해야 하는 코드가 남아 있으며 처리를 위해 서버 응답을 다른 JS 함수에 넘겨주기도 하는데 현재의 코드 실행 상황입니다. is: on the server 응답이 없거나 응답 결과를 처리하는 JS 함수가 처리되어 반환되지 않은 경우 요청 코드가 포함된 함수의 나머지 코드를 실행할 수 없습니다. 단일 스레드와 마찬가지로 요청이 전송된 후 차단 상태에 들어가고 나머지 코드는 차단 상태에 도달할 때까지 계속 실행되지 않습니다.

다음 코드를 보세요:

var flag=true;
var index=0;
$.ajax({
  url: "",
  success: function(data){
    flag=false;
  } 
});
while(flag){
  index++;
}
alert(index);
로그인 후 복사

마지막으로 프로그램이 무한 루프에 들어갔습니다

다음 코드를 보세요:

var flag=true;
$.ajax({
  url: "",
  success: function(data){
    flag=false;
  } 
});
alert(flag);
로그인 후 복사

최종 결과는 true입니다

js는 ajax 요청을 실행하면 네트워크 장애가 발생하여 오랫동안 결과가 반환되지 않는 경우, 동기적으로 실행되면 다음 코드를 실행하기 전에 ajax가 결과를 반환할 때까지 기다려야 합니다. ajax 요청에는 1분이 걸리며, 프로그램은 1분 동안 기다려야 합니다. 비동기적으로 실행하면 서버가 반환되기를 기다리는 동안 포그라운드는 ajax 블록 뒤에 있는 스크립트를 계속 실행하게 되며, 이때 서버가 정상적인 결과를 반환할 때까지 ajax 두 개의 스레드가 실행됩니다. 블록은 ajax 블록 뒤에 있는 요청, 스레드 및 스크립트를 만듭니다.

var flag=true;
var index=0;
$.ajax({
  url: "",
  async:false,
  success: function(data){
    flag=false;
  } 
});
while(flag){
  index++;
}
alert(index);
로그인 후 복사

최종 결과는 0

입니다. [관련 튜토리얼 권장 사항: AJAX 비디오 튜토리얼]

위 내용은 Ajax는 기본적으로 동기식인가요, 비동기식인가요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿