当前位置:网站首页>Promise是什么
Promise是什么
2022-06-27 21:40:00 【陆荣涛】
Promise是什么?
本文主要强调Promise的用法,讨究Promise究竟在干什么。虽然已有大量的资料文档对这个概念进行了详细的讲解。可是对初学者而言,在过于繁琐的书面性概念中,确常常无法抓住重点,对问题本身的理解反而会造成麻烦。本文章只将重点放在作用上,忽略掉其它繁杂的概念,用尽可能直白的语言对这个问题进行剖析。阅读本文需要十分钟左右的时间,希望对您能有所帮助。
Promise:
作用:解决回调地狱问题,将函数嵌套的代码方式改为平级的。
当一个回调函数嵌套一个回调函数的时候,就会出现一个嵌套结构,当嵌套的多了就会出现回调地狱的情况。
为了能更加清晰的体会promise,我们需要先观察一段代码。
function f1(f){
console.log("f1");
f();
}
function f2(f){
console.log("f2");
f();
}
function f3(f){
console.log("f3");
f();
}
function f4(){
console.log("f4");
}
//回调地狱
f1(function(){
f2(function(){
f3(f4);
});
});
代码段有四个函数,f1,f2,f3,f4均为函数,且后一个函数作为前一个函数的参数,然后进行嵌套调用。最终从调用的语法来看,代码十分复杂,我们把回调函数这样调用称为回调地狱。
**Pomise的作用就是将嵌套的调用方式改为平级的。**也就是说从调用的结果上来看,最终本质上是没有任何区别,Pormise只是改变了语法的书写规则。这就是Pomise的基本使用方法。
Promise的语法规则如下:
//使用方法
//1.通常放入一个函数体内
//2.将promise对象作为返回值
//3.promise对象包含的多为异步操作
function fun(){
//success表示成功的回调,failed表示失败时的回调
let p = new Promise(function(success,failed){
if(条件){
success();
}else{
failed();
}
});
return p;
}
function success(){
console.log("success");
}
function failed(){
console.log("failed");
}
//promise对象.then(成功的方法,[失败的方法]);
fun().then(success,failed);
这里promise对象可以将以前通过形参传递的回调函数,用then方法来进行传递。其实promise主要处理的是异步操作,如常见的如ajax请求。我们的每一个异步事件,在执行的时候,都会有三种状态,执行中,成功,失败。这也就解释了为什么then方法为什么会有两个参数,参数1代表成功时执行的回调函数,参数2代表失败时的执行状态。
所以上述函数嵌套调用的代码可以修改为:
function f1(){
console.log("f1");
let p = new Promise(function(f){
f();
});
return p;
}
function f2(){
console.log("f2");
let p = new Promise(function(f){
f();
});
return p;
}
function f3(){
console.log("f3");
let p = new Promise(function(f){
f();
});
return p;
}
function f4(){
console.log("f4");
}
//平级调用的方法
f1().then(f2).then(f3).then(f4);
这样实现的功能和上述代码的功能是完全一样的,但是解决了函数嵌套调用的麻烦。
结论:Pomise的作用就是将嵌套的调用方式改为平级的,用于处理异步操作。
*陆荣涛前端学习交流Q群858752519
加群备注:CSDN推荐

边栏推荐
猜你喜欢

webService

零基础自学SQL课程 | IF函数

Local visualization tool connects to redis of Alibaba cloud CentOS server

Stream + Nacos

Storage structure of graph

How to quote Chinese documents when writing a foreign language?
![[PCL self study: segmentation4] point cloud segmentation based on Min cut](/img/af/a6c5abf357c1db0718df505499df70.png)
[PCL self study: segmentation4] point cloud segmentation based on Min cut

MySQL分表查询之Merge存储引擎实现

Halcon's region: features of multiple regions (6)

Safe, fuel-efficient and environment-friendly camel AGM start stop battery is full of charm
随机推荐
【AI应用】NVIDIA GeForce RTX 1080Ti的详情参数
Zero foundation self-study SQL course | if function
Count prime [enumeration - > space for time]
How to quote Chinese documents when writing a foreign language?
Feign implements path escape through custom annotations
Can you do these five steps of single cell data cleaning?
[AI application] detailed parameters of NVIDIA geforce RTX 3060
数仓的字符截取三胞胎:substrb、substr、substring
华泰证券在网上开户安全吗?
[黑苹果系列] M910x完美黑苹果系统安装教程 – 2 制作系统U盘-USB Creation
Excel print settings public header
【论文阅读|深读】SDNE:Structural Deep Network Embedding
赛尔笔记|视频文本预训练简述
ICML 2022:ufrgs | optimistic linear support and subsequent features as the basis for optimal strategy transfer
How to find Chinese documents corresponding to foreign documents?
【PCL自学:Segmentation3】基于PCL的点云分割:区域增长分割
[AI application] detailed parameters of NVIDIA Tesla v100-pcie-32gb
手把手教你移植 tinyriscv 到FPGA上
【AI应用】NVIDIA GeForce RTX 3060的详情参数
圖的存儲結構