jquery ajax屬性async(同步異步)

在jquery的ajax中如果我們希望實現同步或者異步時我們可以直接設置async屬性為false和true

同步執行

當把async設為false時，這時ajax的請求時同步的
也就是說，這個時候ajax塊發出請求后，他會等待在load()這個地方，不會去執行after() 直到load()部分執行完畢

前台

<script src="//cdn.bootcss.com/jquery/2.1.3/jquery.min.js"></script>
<script>
    function load(msg) {
        console.log(msg);
    }
    function after(){
        console.log('after');
    }
    $.ajax({
        url: '/ajax',
        method: 'GET',
        async: false
    }).success(function(result){
        load(result);
    });
    after();
</script>

后台

var http = require('http');
var fs = require('fs');
http.createServer(function(req,res){
    if(req.url == '/sync'){
        fs.createReadStream('sync.html').pipe(res);
    }else if(req.url == '/ajax'){
        setTimeout(function(){
            res.end('ok');
        },5000);
    }else{
        res.end('Not Found');
    }
}).listen(8080);

異步執行

在這里,async默認的設置值為true，這種情況為異步方式
就是說當ajax發送請求后，在等待server端返回的這個過程中，前台會繼續執行ajax塊后面的腳本，直到server端返回正確的結果才會去執行success 也就是說這時候執行的是兩個線程，ajax塊發出請求后一個線程和ajax塊后面的腳本(另一個線程)

前台

<script src="//cdn.bootcss.com/jquery/2.1.3/jquery.min.js"></script>
<script>
    function load(msg) {
        console.log(msg);
    }
    function after(){
        console.log('after');
    }
    $.ajax({
        url: '/ajax',
        method: 'GET',
        async: true
    }).success(function(result){
        load(result);
    });
    after();
</script>

后台

var http = require('http');
var fs = require('fs');
http.createServer(function(req,res){
    if(req.url == '/sync'){
        fs.createReadStream('sync.html').pipe(res);
    }else if(req.url == '/async'){
        fs.createReadStream('async.html').pipe(res);
    } else if(req.url == '/ajax'){
        setTimeout(function(){
            res.end('ok');
        },5000);
    }else{
        res.end('Not Found');
    }
}).listen(8080);