Home  >  Article  >  Web Front-end  >  Is ajax synchronous or asynchronous by default?

Is ajax synchronous or asynchronous by default?

青灯夜游
青灯夜游Original
2022-01-17 16:14:485298browse

ajax defaults to asynchronous submission; AJAX is divided into synchronous "false" and asynchronous "true" according to the async value, and by default the async value is true (asynchronous submission). The advantage of this is that it can improve the user experience through partial refresh, while also saving resources and reducing the pressure on the database.

Is ajax synchronous or asynchronous by default?

The operating environment of this tutorial: windows7 system, javascript version 1.8.5, Dell G3 computer.

The default submission method of ajax is asynchronous submission. The advantage of this is that it can improve the user experience through partial refresh, while also saving resources and reducing the pressure on the database.

AJAX is divided into synchronous (async = false) and asynchronous (async = true) according to the value of async

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

By default, async is true (asynchronous submission).

The way to change to synchronization is to change the default value of async to false, which is usually true or not written. If it is changed to false, the function of ajax will be lost.

1. What is a synchronous request: (false)

A synchronous request means that after the current request is issued, the browser cannot do anything and must wait until the request is completed and returned. After the data is collected, the subsequent code will be executed, which is equivalent to queuing. The previous person has completed his or her own affairs before the next person can continue. That is to say, when the JS code is loaded into the current AJAX, all the code in the page will stop loading, and the page will be in a state of suspended animation. When the AJAX is completed, it will continue to run other codes and the page will release the suspended animation state (that is, when ajax returns After receiving the data, the following function 2) is executed.

2. What is an asynchronous request: (true)

An asynchronous request means that the browser can continue to do anything while sending the request. Ajax does not send a request. It will affect the loading of the page and the user's operation. It is equivalent to being on two lines, each going its own way without affecting each other.

Generally the default value is true, asynchronous. Asynchronous requests do not affect the user experience at all. No matter how long or short the request is, the user is concentrating on operating other content on the page and does not feel like waiting.

What is the difference between synchronization and asynchronous:

Asynchronous: In asynchronous mode, after we use AJAX to send the request, there may be code that needs to be executed. At this time, the server may not have responded to our request due to various reasons, but because we use asynchronous execution, the remaining code in all functions containing AJAX request code will continue to execute. If we hand over the request result to another JS function for processing, then it will be like two threads executing at the same time.

Synchronization: In synchronous mode, after we use AJAX to send the request, there is still code that needs to be executed. We also hand over the server response to another JS function for processing, but the code execution at this time Yes: When the server does not respond or the JS function that processes the response result has not processed the return, the remaining code of the function containing the request code cannot be executed. Just like a single thread, it enters the blocking state after the request is sent, and the remaining code will not continue to execute until it touches the blocking state.

Look at the following code:

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

The final program entered an infinite loop

Look at the following code:

var flag=true;
$.ajax({
  url: "",
  success: function(data){
    flag=false;
  } 
});
alert(flag);

The final result is true

JS is single-threaded. Since executing an ajax request will take a certain amount of time, or even a network failure occurs and the result is not returned for a long time; at this time, if it is executed synchronously, it must wait until ajax returns the result. Execute the following code. If the ajax request takes 1 minute, the program will have to wait for 1 minute. If it is executed asynchronously, while waiting for the server to return, the foreground will continue to execute the script behind the ajax block. Success will not be executed until the server returns normal results. At this time, two threads are executed, ajax After the block makes the request, a thread and the script behind the ajax block

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

The final result is 0

[Related tutorial recommendations: AJAX video tutorial]

The above is the detailed content of Is ajax synchronous or asynchronous by default?. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn