IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> 关于Promise那些事系列(1) -> 正文阅读

[JavaScript知识库]关于Promise那些事系列(1)

上一篇写了同步和异步,也提到了回调函数,异步编程需要通过回调函数来完成。

一、回调函数

在日常项目工作中一定有需要多次异步请求到结果后在执行的代码,比如

function f1(f2){
            console.log(1)
        }
        function f2(f3){
            console.log(2)
        }
        function f3(){
            console.log(3)
        }
        f1(f2(f3()))

这段代码的输出结果是:3 2 1

二、Promise

有人要问了,回调函数已经可以实现我们需求了,为什么后面还出现了Promise呢?
答:回调函数会造成“回调地狱”,也就是我们有很多个回调函数后,代码的逻辑性很难梳理。
最初Promise是由社区提出和实现,后来ES6将它写进了语言标注,统一了用法。

1.Promise是什么呢?

从官方的解释上来看,Promise是个对象,但是它有两个不同于对象的特点:

  1. Promise的状态不受外界的影响。它有三种状态:pending(进行中)、fulfilled(已完成)、rejected(已失效)。只有异步操作的结果可以决定Promise对象当前是哪种状态,一旦状态确定就再也无法改变。
  2. Promise对象的状态改变后,任何时候都可以得到这个结果。Promise对象的状态改变只有两种可能:从pending变成fulfilled或者从pending变成rejected。这就与事件的执行不一致了,事件的特点是,一旦错过了执行结果,再去监听结果,是得不到结果的。

Promise对象解决了回调函数带来了“回调地狱”的缺点,避免了蹭蹭嵌套。同时它也带来了其他缺点,比如:
1. 无法取消Promise,一旦新建它就会立即执行,无法中途取消。
2. 如果不设置回调函数(then),Promise内部抛出的错误,不会反馈到外部。
3. 当Promise对象处于pending状态时,无法得知目前进行进度。

2. Promise的基本使用

ES6规定,Promise对象是一个构造函数,用来生成promise实例。

    let promise = new Promise((resolve,reject)=>{
      //一些代码
      if(/*异步代码执行成功*/){
        resolve(value)
      }else{
        reject(error)
      }
    })

Promise给构造对象接收一个函数作为参数,这里resolvereject

  • resolve函数,将Promise对象状态从pending变成resolved(为了方便记忆,这里将用resolved代替fulfilled),在异步操作成功时调用,并将异步操作成功的结果作为参数传递出去。
  • reject函数,将Promise对象状态从pending变成rejected,在异步操作时调用,将异步操作报出的错误作为参数传递出去。

Promise实例生成之后,可以使用thien方法执行resolved状态和rejected状态的返回函数,也就是上面说的操作成功和失败的结果传递出去。

    promise.then(value=>{
      //成功
    },error=>{
      //失败
    })

下一篇详细讲述Promise.thien()方法。下一篇见~
在这里插入图片描述

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2022-02-04 10:57:06  更:2022-02-04 10:57:08 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/24 11:22:22-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码