异步操作

[TOC]

Promise

let p = new Promise(function (resolve,reject) 
{
    $.ajax
    ({
        url:"arr.txt",
        success(arr){
            resolve(arr)
        },
        error(res){
            reject(res);
        }
    })
});
//第一个函数是resolve，第二个函数是reject
p.then(function (arr)
{
    alert("成功");
    console.log(arr);
},function (res) {
    alert("失败");
    console.log(res);
})

实际上jquery的$.ajax返回的也是一个Promise

$.ajax({
    url: 'arr.txt',
    dataType: 'json',
}).then(arr=>{
    alert(arr);
},res=>alert(res))

批量读取：

Promise.all([
    $.ajax({url: 'arr.txt',dataType: 'json'}),
    $.ajax({url: 'arr2.txt',dataType: 'json'}),
    $.ajax({url: 'json.json',dataType: 'json'}),
]).then(arr=>{
    console.log(...arr[0]);
    console.log(...arr[1]);
    console.log(arr[2].name,arr[2].age,arr[2].sex);
}, res=>{
    alert("失败");
})
//输出
5 56 89 13 6 56
21 1 457 99 89
22 maid 20 男

async/awite

使用同步写法执行异步操作

async能让函数暂停
await在该语句后面等待

async function show() {
    let a = 5;
    let b = 6;
    let data = await $.ajax({url:'arr.txt',dataType:'json'});
    alert(a+b+data[0]);  //16
}
show();

这种语法想要报错就使用try catch

实际上：

function show() {
    let a = 5;
    let b = 6;
    let data = $.ajax({url:'arr.txt',dataType:'json'}).then(arr=>{alert(a+b+arr[0])});//16
}
show();