zoukankan      html  css  js  c++  java
  • Promise小结 ES6异步编程

    Promise

    Promise是什么:

    Promise 是 JS 中进行异步编程的新的解决方案,ES6新增的语法(1)
    从语法上来说: Promise 是一个构造函数
    从功能上来说: promise 对象用来封装一个异步操作并可以获取其结果

    promise 的状态改变

    pending 变为 resolved
    pending 变为 rejected
    说明: 只有这 2 种, 且一个 promise 对象只能改变一次
    无论变为成功还是失败, 都会有一个结果数据
    成功的结果数据一般称为 vlaue, 失败的结果数据一般称为 reason

    为什么要用Promise?

    1. 指定回调函数的方式更加灵活:
      旧的: 必须在启动异步任务前指定
      promise: 启动异步任务 => 返回 promie 对象 => 给 promise 对象绑定回调函数
      (甚至可以在异步任务结束后指定)

    2. 支持链式调用, 可以解决回调地狱问题
      什么是回调地狱?
      回调函数嵌套调用, 外部回调函数异步执行的结果是嵌套的回调函数执行的条件
      回调地狱的缺点?
      不便于阅读 / 不便于异常处理
      解决方案? promise 链式调用

    3. 终极解决方案? async/await

    区别实例对象与函数对象

    • 实例对象: new 函数产生的对象, 称为实例对象, 简称为对象

    • 函数对象: 将函数作为对象使用时, 简称为函数对象

    function Fn() { }
    
    const fn = new Fn()
    

    JS error 处理

    错误的类型
    Error: 所有错误的父类型
    ReferenceError: 引用的变量不存在
    TypeError: 数据类型不正确的错误
    RangeError: 数据值不在其所允许的范围内
    SyntaxError: 语法错误

    错误处理
    捕获错误: try ... catch
    抛出错误: throw error

    error 对象的结构
    message 属性: 错误相关信息
    stack 属性: 函数调用栈记录信息

    如何使用Promise?

    // 创建 promise 对象 
    const p = new Promise((resolve, reject) => { 
    // 执行异步操作 
    setTimeout(() => { 
    const time = Date.now() // 如果当前时间是奇数代表成功, 偶数代表失败
    // 如果成功了, 调用 resolve(value) 
    if (time%2===1) { resolve('成功的数据'+time) } 
    else { // 如果失败了, 调用 reject(reason) reject('失败数据'+time) } }, 1000) 
    })
    
    // 通过 promise 的 then()指定成功和失败的回调函数 
    p.then( value => { 
    console.log('成功的回调, value:', value) 
    },reason => { 
    console.log('失败的回调, reason:', reason) } )
    

    Promise 构造函数: Promise (excutor) {}

    API (使用时再查询)

    Promise 构造函数: Promise (excutor) {}
    excutor 函数: 执行器 (resolve, reject) => {}
    resolve 函数: 内部定义成功时我们调用的函数 value => {}
    reject 函数: 内部定义失败时我们调用的函数 reason => {}

    说明: excutor 会在 Promise 内部立即同步回调,异步操作在执行器中执行

    Promise.prototype.then 方法: (onResolved, onRejected) => {}

    onResolved 函数: 成功的回调函数 (value) => {}
    onRejected 函数: 失败的回调函数 (reason) => {}

    说明: 指定用于得到成功 value 的成功回调和用于得到失败 reason 的失败回调
    返回一个新的 promise 对象

    视频学习:尚硅谷Web前端Promise教程从入门到精通

    async与await

  • 相关阅读:
    下载文件
    文件上传后台
    触发器
    存储过程
    火狐浏览器不能获取 event,解决js报错问题
    Oracle 数据库--一个用户同步的sql
    基于二进制的权限控制
    自定义jsp标签
    http,socket和websocket
    正向代理和反向代理
  • 原文地址:https://www.cnblogs.com/yoona-lin/p/14888832.html
Copyright © 2011-2022 走看看