Promise简介

学promise来我这里肯定没错了
ECMAScript promise的到来就是为了解决AJAX嵌套的请求

         $.ajax({
            url: './t1.txt',
            dataType: 'text',
            success: data => {
                $.ajax({
                    url: './t1.txt',
                    dataType: 'text',
                    success: data => {
                        $.ajax({
                            url: './t1.txt',
                            dataType: 'text',
                            success: data => {
                                console.log(data);
                            },
                            error: err => {
                                console.log(err);
                            }
                        })
                    },
                    error: err => {
                        console.log(err);
                    }
                })
            },
            error: err => {
                console.log(err);
            }
        })

promise 他是在未来或者某一个时间执行的一些事情；先简单的看看的Promise实例：

//此时的是一进页面就会执行的一个实例
var promise1 =  new Promise((resolve, reject) =>{
// 当然这个 promise 不写 ajax 也行 随便写个if 判断也行 
$.ajax({
    url: './t3.txt',
    dataType: 'text',
    success: data =>{
        //当请求成功 调用promise 成功回调函数
        resolve(data);
    },
    error: err => {
        //当请求失败 调用 promise 失败回调函数
        reject(err);
    }
})
})
//promise1.then() 你可以看出来  第一个的回调函数是成功 第二个的回调函数是失败 
promise1.then((data)=>{
  console.log(data);
},(err)=>{
      console.log(err);
})

也许你会想现在不也和直接请求ajax一样吗没有什么区别别着急吗？

var promise1 =  new Promise((resolve, reject) =>{
$.ajax({
    url: './t1.txt',
    dataType: 'text',
    success: data =>{
        resolve(data);
    },
    error: err => {
        reject(err);
    }
  })
})
var promise2 =  new Promise((resolve, reject) =>{
$.ajax({
    url: './t2.txt',
    dataType: 'text',
    success: data =>{
        resolve(data);
    },
    error: err => {
        reject(err);
    }
  })
})
var promise3 =  new Promise((resolve, reject) =>{
$.ajax({
    url: './t3.txt',
    dataType: 'text',
    success: data =>{
        resolve(data);
    },
    error: err => {
        reject(err);
    }
})
})
promise1.then((data)=>{
  console.log(data);
},(err)=>{
  console.log(err);
})
promise1.then((data)=>{
  console.log(data);
},(err)=>{
  console.log(err);
})
promise1.then((data)=>{
  console.log(data);
},(err)=>{
  console.log(err);
})

是不是这样看起来也挺繁琐好了不啰嗦了

 function getTxt(url){
//此时的是一进页面就会执行的一个实例
return new Promise((resolve, reject) =>{
    // 当然这个 promise 不写 ajax 也行 随便写个if 判断也行
    $.ajax({
        url,
        dataType: 'text',
        success: data =>{
            //当请求成功 调用promise 成功回调函数
            resolve(data);
        },
        error: err => {
            //当请求失败 调用 promise 失败回调函数
            reject(err);
        }
    })
  })
}
//Promise.all() 里面只有一个参数 那就是一个数组 数组里面的每一项必须是一个promise 实例对象
//当然 all 是什么意思 是全部  他要是只有一个没用请求过来的话 那就会直接执行 err 函数
// 成功力的回调函数 只有一个参数 也是一个数组 里面装的是  3个请求过来的 数据
Promise.all([getTxt('t1.txt'),getTxt('t2.txt'),getTxt('t3.txt')]).then((data)=>{
    console.log(data);
},(err)=>{
    console.log(err);
})

promise =》承诺状态一旦改变就永远不会改变

promise 常用的方法我目前了解的就这几个，
如果大家有什么不懂得或者是不理解的可以留言哦

最后编辑于：2018.07.26 14:10:53