ES6—43:Promise

简介: ES6—43:Promise

基本使用

image.png

Promise封装读取文件

image.png

Promise封装AJAX请求

const p = new Promise((resolve,reject) => {
    // 1. 创建对象
    const xhr = new XMLHttpRequest();
    // 2. 初始化
    xhr.open("GET","https://api.apiopen.top/getJoke");
    // 3. 发送
    xhr.send();
    // 4. 绑定事件,处理响应结果
    xhr.onreadystatechange = function() {
        if (xhr.readyState === 4) {
            if (xhr.status >= 200 && xhr.status <= 300) {
                resolve(xhr.response);
            } else {
                reject(xhr.status);
            }
        }
    }
});
p.then(function(value) {
    console.log(value);
},function(reason) {
    console.log(reason);
});

image.png

Promise.prototype.then 方法

then方法的返回值分以下三种情况:


image.png

Promise对象的catch方法

此方法是当Promise对象的状态为reject时,调用的方法,参数只是一个函数

image.png

使用Promise读取三个文件中的内容

// 首先,引入fs模块
const fs = require('fs');
const p = new Promise((resolve,reject) => {
    fs.readFile("./test.md",(err,data) => {
        resolve(data);
    });
});
p.then((value) => {
    return new Promise((resolve,reject) => {
        fs.readFile("./木言人.md",(err,data) => {
            resolve([value,data]);
        });
    });
}).then((value) => {
    return new Promise((resolve) => {
        fs.readFile("./读书有感.md",(err,data) => {
            value.push(data);
            resolve(value);
        });
    });
}).then((value) => {
    console.log(value.toString());
});

Promise.allSettled()方法

  • 参数是一个数组。
  • 这个数组的每一个元素都是一个Promise对象
  • 该方法返回的始终是一个成功的Promise对象,这个对象的结果包含了参数数组中的每一个Promise对象的返回状态和值。

image.png

相关文章
|
1月前
|
前端开发
理解 ES6 中的 Promise
【10月更文挑战第24天】ES6 中的 Promise 是一种用于处理异步操作的机制,它提供了一种更优雅、更可控的方式来处理异步任务的结果。Promise 可以看作是对异步操作结果的一种承诺,它可以处于三种不同的状态:Pending(等待中)、Fulfilled(已完成,即成功)和 Rejected(已拒绝,即失败)。
|
2月前
|
前端开发 JavaScript 小程序
JavaScript的ES6中Promise的使用以及个人理解
JavaScript的ES6中Promise的使用以及个人理解
23 1
|
2月前
|
前端开发 Java
说说你对es6中promise的理解?
说说你对es6中promise的理解?
17 1
|
2月前
|
前端开发 Java
说说你对es6中promise的理解?
说说你对es6中promise的理解?
|
3月前
|
前端开发 JavaScript
ES6新标准下JS异步编程Promise解读
ES6新标准下JS异步编程Promise解读
41 3
|
4月前
|
前端开发
手写实现ES6的Promise.all()和Promise.race()函数
这篇文章介绍了如何手写实现ES6的`Promise.all()`和`Promise.race()`函数,提供了实现这两个Promise聚合函数的详细代码示例,并展示了如何使用它们。
手写实现ES6的Promise.all()和Promise.race()函数
|
2月前
|
存储 前端开发 JavaScript
关于 ES6 中 Promise 的面试题
关于 ES6 中 Promise 的面试题
19 0
|
5月前
|
前端开发 JavaScript
ES6 中 Promise对象使用学习
ES6 中 Promise对象使用学习
49 1
|
4月前
|
前端开发 JavaScript
ES6新特性(五):Promise优雅地处理异步
ES6新特性(五):Promise优雅地处理异步
|
6月前
|
JSON 前端开发 JavaScript
ES6引入Promise和async/await解决异步问题
【6月更文挑战第12天】ES6引入Promise和async/await解决异步问题。Promise处理异步操作,有pending、fulfilled、rejected三种状态,支持链式调用和并行处理。async/await是基于Promise的语法糖,使异步代码更同步化,提高可读性。两者都是处理回调地狱的有效工具,开发者应根据需求选择合适的方式。
56 3