zoukankan      html  css  js  c++  java
  • 2021年5月16日

    时间:0.7个小时左右

    代码:190行左右

    博客:1

    知识点:promise常用api的实例方法、对象方法

    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>Document</title>
    </head>
    <body>
      
      <script type="text/javascript">
        /*
          Promise常用API-实例方法
        */
        // console.dir(Promise);
        function foo() {
          return new Promise(function(resolve, reject){
            setTimeout(function(){
              // resolve(123);
              reject('error');
            }, 100);
          })
        }
        // foo()
        //   .then(function(data){
        //     console.log(data)
        //   })
        //   .catch(function(data){
        //     console.log(data)
        //   })
        //   .finally(function(){
        //     console.log('finished')
        //   });
    
        // --------------------------
        // 两种写法是等效的
        foo()
          .then(function(data){
            console.log(data)
          },function(data){
            console.log(data)
          })
          .finally(function(){
            console.log('finished')
          });
      </script>
    </body>
    </html>
    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>Document</title>
    </head>
    <body>
      
      <script type="text/javascript">
        /*
          Promise常用API-对象方法
        */
        // console.dir(Promise)
        function queryData(url) {
          return new Promise(function(resolve, reject){
            var xhr = new XMLHttpRequest();
            xhr.onreadystatechange = function(){
              if(xhr.readyState != 4) return;
              if(xhr.readyState == 4 && xhr.status == 200) {
                // 处理正常的情况
                resolve(xhr.responseText);
              }else{
                // 处理异常情况
                reject('服务器错误');
              }
            };
            xhr.open('get', url);
            xhr.send(null);
          });
        }
    
        var p1 = queryData('http://localhost:3000/a1');
        var p2 = queryData('http://localhost:3000/a2');
        var p3 = queryData('http://localhost:3000/a3');
        // Promise.all([p1,p2,p3]).then(function(result){
        //   console.log(result)
        // })
        Promise.race([p1,p2,p3]).then(function(result){
          console.log(result)
        })
      </script>
    </body>
    </html>
  • 相关阅读:
    关于回调地狱
    node.js 关于跨域和传递给前台参数
    关于js的当前日期的格式化,和两个日期之间的相减的天数
    CSS 关于让页面的高度达到电脑屏幕的底部
    前端 为什么我选择用框架而不是Jquery
    关于webpack打包图片的路径问题
    关于webpack打包js和css
    微信小程序网络请求的setDate
    WinSocket聊天程序实例(多线程)
    Orcal的JDBC数据连接方式
  • 原文地址:https://www.cnblogs.com/j-y-s/p/14903335.html
Copyright © 2011-2022 走看看