promise对象基本使用。——使用同步流程表示异步操作

0.为什么要介绍promise
  • 因为js是串行,单线程语言。是同步流程,代码只能顺序执行。(详见:简述进程、线程、串行、并行基本概念,便于快速理解
  • 企业开发中为了保存异步代码的执行顺序, 那么就会出现回调函数层层嵌套
  • 如果回调函数嵌套的层数太多, 就会导致代码的阅读性, 可维护性大大降低
  • promise对象可以将异步操作以同步流程来表示, 避免了回调函数层层嵌套(回调地狱)
    顺序打印:1,2,3。常用异步加载方法:
   function request(fn) {
        setTimeout(function () {
            fn("拿到的数据");
        }, 1000);
    }
    request(function (data) {
        console.log(data, 1);
        request(function (data) {
            console.log(data, 2);
            request(function (data) {
                console.log(data, 3);
            });
        });
    });
1.什么是Promise?

Promise是ES6中新增的一个对象,
通过Promise就可以实现 用同步的流程来表示异步的操作
通过Promise就可以 避免回调函数层层嵌套(回调地狱)问题

2.如何创建Promise对象?

new Promise(function(resolve, reject){});
promise对象不是异步的, 只要创建promise对象就会立即执行存放的代码。是同步代码。

3.Promise是如何实现 通过同步的流程来表示异步的操作的?

promise对象是通过状态的改变来实现的, 只要状态发生改变就会自动触发对应的函数

4.Promise对象三种状态
  • pending: 默认状态,只要没有告诉promise任务是成功还是失败就是pending状态
let promise = new Promise(function (resolve, reject) {
});
console.log(promise);

pending状态

  • fulfilled(resolved): 只要调用resolve函数, 状态就会变为fulfilled, 表示操作成功
let promise = new Promise(function (resolve, reject) {
    resolve();
});
console.log(promise);

resolve状态

  • rejected: 只要调用rejected函数, 状态就会变为rejected, 表示操作失败
let promise = new Promise(function (resolve, reject) {
   reject();
});
console.log(promise);

rejected状态

注意点: 状态一旦改变既不可逆, 既从pending变为fulfilled, 那么永远都是fulfilled
既从pending变为rejected, 那么永远都是rejected

5.监听Promise状态改变

我们还可以通过函数来监听状态的变化
resolved --> then()
rejected --> catch()

let promise = new Promise(function (resolve, reject) {
    resolve();  //then函数被执行
    reject();  //catch函数被执行
});
promise.then(function () {
    console.log("then")
});
promise.catch(function () {
    console.log("catch");
})
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值