zoukankan      html  css  js  c++  java
  • 笔记:promise实例+注释

    //////////////////////////////////////////////
    var data = [1,2,3,4];
    var promise = new Promise((resolve, reject) => {
      console.log('init');
    
      resolve(data); //成功的时候传入的参数data
      reject(error); //失败的时候传入的参数error
    });
    
    promise
    .then((data) => {
      console.log(data); //成功
      return data; //返回data给下一个then()
    })
    .then((val) => { //val指上面返回的data,所以数据与命名无关
      val.map((item) => {
        console.log(item); //成功
      });
    })
    .then(() => {
      throw new Error('error!!!'); //抛出错误
    })
    .catch((error) => {
      console.log('error '+ error); //捕获错误,让程序继续运行
    })
    .then((data) => {
      console.log(typeof data); //undefined,因为data没有传过来
    })
    
    ///////////////////////////////////////////工作流
    let data = 'this is data'
    function asyncFunc(data) {
      return new Promise((resolve, reject) => {
        resolve(data);
        reject(error);
      });
    }
    
    asyncFunc(data)
    .then((data) => {
      console.log(data);
    })
    .catch((error) => {
      console.log(error);
    })
    
    ////////////////////////////ajax与异步操作
    
    function getUrl(url) {
      return new Promise((resolve, reject) => {
        let req = new XMLHttpRequest();
        req.open('GET', url, true);
        req.onload = () => {
          req.status === 200
            ? resolve(req.responseText)
            : reject(new Error(req.statusText))
        }
        req.send();
      });
    }
    
    let url = 'http://httpbin.org/get';
    
    // 异步操作,resolve状态后不会立即执行then()
    getUrl(url) // 1
    .then((data) => { // 7/8
      console.log(data);
    })
    .catch((error) => {
      console.error(error);
    })
    
    console.log('1'); // 2
    setTimeout(() => { // 5
      console.log('2');
    }, 0);
    setTimeout(() => { // 6
      console.log('3');
    }, 0);
    setTimeout(() => {  // 7/8 根据时间而定,等待时间长会先执行then()
      console.log('4');
    }, 1000);
    console.log('5'); // 3
    console.log('6'); // 4
    
    //////////////////////////////////////
    
  • 相关阅读:
    第10节--单行函数之数学函数
    第九节--单行函数之日期函数
    【译】什么是游戏开发实体系统框架(终)
    【译】什么是游戏开发实体系统框架(一)
    【译】游戏《实体系统框架》译文——序
    IDEA 快捷键
    Java学习笔记1
    Java面试题
    Java学习笔记——集合
    Java学习笔记——String类常用方法
  • 原文地址:https://www.cnblogs.com/dkplus/p/8436541.html
Copyright © 2011-2022 走看看