ES6 promise学习

Promise 是异步编程的一种解决方案,比传统的解决方案——回调函数和事件——更合理和更强大。

1.promise是一构造函数,既然是构造函数,那么我们就可以用 new Promise()得到一个promise实列。

2.在promise上,有来给个函数,分别叫做resolve(成功之后的回调函数)和 reject(失败之后的的回调函数)

3.在promise构造函数的protype属性上,有一个.then()方法,也就是说,只要是promise构造函数创建的实例,都可以访问到.then()方法。

4.Promise表示一个异步操作;每当我们new一个promise的实例,这个实力,好表示一个具体的异步操作;

5.既然promise创建的实例,是一个异步操作,那么,这个异步操作的结果,只有两种状态

  5.1状态1:异步执行成功了,需要在内部调用成功的回调函数resolve把结果返回调用者

  5.2状态2:异步执行失败了,需要在内部调用失败的回调函数reject把结果返回调用者

  5.3由于promise的实例是一个异步操作,所以,内部拿到操作的结果后,无法使用return把操作的结果返回调研组,这时候,只能使用回调函数的形式,来把成功或失败的的结果,返回调用者。

 

function getFilePath(fpath){
            var promise=new Promise(function(resolve,reject){
                fs.readFile(fpath,'utf8',(err,dataStr)=>{
                    
                    // 这里面使用return不能返回值, 只能调用回调
                    if(err) return reject(err);
                    resolve(dataStr)
                })
            })
            return promise;
        }
        var p=getFilePath('1.txt');
        p.then(function(data){
            console.log(data)
        },function(err){
                // console.log(data+'+++++');
                console.log(err.message)
            })

 promise的正确使用方式

 // 串联的方式
        // 读取文件1
        const fs=require('fs')
        function getFilePath(fpath){
            return new Promise(function(resolve,reject){
                        fs.readFile(fpath,'utf8',(err,dataStr)=>{
                            
                            // 这里面使用return不能返回值, 只能调用回调
                            if(err) return reject(err);
                            resolve(dataStr)
                        })
                    })
        }
        // 先读取文件1,再读取文件2,文件3,
        // 如果前面的promise的执行失败,我们不想让后续的promise操作被终止,可以为每个promise指定失败的回调
        getFilePath('11.txt').then(function(data){
            console.log(data);
             // 读取文件2
            return getFilePath('2.txt')
        },function(err){
           
            console.log('这是失败的结果'+err.message);
             // return 一个新的promise,不耽误后面的执行
             return getFilePath('2.txt')
        }).then(function(data){
            console.log(data);
             // 读取文件3
            return getFilePath('3.txt')
        }).then(function(data){
            console.log(data)
        })

 当我们有这样的需求,哪怕前面的promise执行失败了,但是不要影响后续promise的正常执行,此时,我们可以单独为每个promise,通过.then指定下一个失败的回调

2.有时候,我们有这样的需求,和上面的需求相反,如果后续的promise执行,依赖于前面promise执行结果,如果前面的失败了,则后面的就没有继续执行下去的意义了,此时,我们想要

实现,一旦有报错则立即终止所有的promise执行

 1 const fs=require('fs')
 2 function getFilePath(fpath){
 3     return new Promise(function(resolve,reject){
 4                 fs.readFile(fpath,'utf8',(err,dataStr)=>{
 5                     
 6                     // 这里面使用return不能返回值, 只能调用回调
 7                     if(err) return reject(err);
 8                     resolve(dataStr)
 9                 })
10             })
11 }
12 // 先读取文件1,再读取文件2,文件3,
13 // 如果前面的promise的执行失败,我们不想让后续的promise操作被终止,可以为每个promise指定失败的回调
14 getFilePath('1.txt').then(function(data){
15     console.log(data);
16      // 读取文件2
17     return getFilePath('12.txt')
18 }).then(function(data){
19     console.log(data);
20      // 读取文件3
21     return getFilePath('3.txt')
22 }).then(function(data){
23     console.log(data)
24 }).catch(function(err){
25     // catch作用:如果前面有任何的promise执行失败,即立即终止所有的promise的执行
26     // 并马上进入catch去处理promise中并抛出异常
27     console.log(err.message)
28 })
View Code

 使用promisej结合ajax

 1    <button type="button" value="获取数据" id="btn">"获取数据</button>
 2     <script>
 3         $(function(){
 4             $('#btn').on('click',function(){
 5                 $.ajax({
 6                     url:'data.json',
 7                     type:'get',
 8                     dataType:'json',
 9                    
10                 }).then(function(data){
11                     console.log(data);
12                 })
13             })
14         })    
15     </script>
View Code
原文地址:https://www.cnblogs.com/wanqingcui/p/10741610.html