JS中的Promise对象，解决回调地狱案例详解，让代码同步执行

最新推荐文章于 2024-08-16 11:34:03 发布

林忆5252

最新推荐文章于 2024-08-16 11:34:03 发布

阅读量857

点赞数

分类专栏： js 文章标签： javascript 前端 es6

本文链接：https://blog.csdn.net/weixin_46028831/article/details/121170512

版权

本文探讨JavaScript中的Promise对象如何有效解决回调地狱问题，实现异步代码的同步执行。通过实例分析回调地狱的困境，详细介绍Promise的创建、状态转换以及then方法的使用。此外，还介绍了ES2017引入的async/await语法，如何简化Promise的使用，使得异步编程更加清晰和易于维护。

摘要由CSDN通过智能技术生成

Promise对象，解决回调地狱，同步执行代码

此文章记录一下所研究的知识点
BY：林忆
前言：

异步操作是JS中的一个优势，同时又带来了极大的麻烦，有一个词叫回调地狱，也就是在一个回调函数里面，执行另外一个异步任务，一直往里面嵌套，导致可读性非常差，不便于维护
Promise就是ES6新出的一种解决方案，用来解决回调地狱
Promise能让异步代码变成同步执行
异步任务有：事件，定时器，Ajax请求，文件操作，数据库操作。异步任务只能由回调函数接收结果

// 回调地狱，案例
// 异步操作什么时候返回结果是不可控的，如果要按顺序来请求，那么就只能将这些操作嵌套起来
$.get(url,function(res){
   
    $.get(url,function(res){
   
    	$.get(url,function(res){
   
    		console.log(res);  // 拿到最终结果
		})
	})
})
// 下面有 回调地狱 解决案例代码

介绍

Promise是异步编程的一种解决方案，从语法上看，它是一个对象，使用时需要new
Promise 可以理解为一个容器，里面可以编写异步代码。
new Promise 和 new 其它对象一样，是同步任务。
获取结果的时候，调用 resolve 触发then方法时是异步的，成功的结果给resolve，失败给reject

创建Promise对象和使用

// 创建Promise对象
// 其中 传入的函数会自动执行，并且会立即执行，属于同步任务
let p = new Promise(function (resolve, reject) {
   
    $.ajax({
   
        url: 'http://123.57.109.30:3000/api/categoryFirst',
        success(res) {
   
            resolve(res); //成功调用 resolve方法
        },
        error(err) {
   
            reject(err