promise和async都是做异步处理的, 使异步转为同步

1.promise

它和Promise诞生的目的都是为了解决“回调地狱”,

promise使用方法:

<button @click="testBtn()">点击</button>

  

    get(data) {
return new Promise((resolve, reject)=>{
if (data > 5) {
resolve(data);
} else {
reject("数据都是不大于5");
}
});
}, testF(num) {
console.log("=====", num)
}, // 调用
testBtn() {
this.get(6).then((num)=>{
this.testF(num);
});
this.get(3).then((num)=>{
this.testF(num);
});
}

  

2.async

async,会返回一个promise对象

  如果async函数中是return一个值,这个值就是Promise对象中resolve的值;

  如果async函数中是throw一个值,这个值就是Promise对象中reject的值。

async的使用方法:

async function imAsync(num) {
if (num > 0) {
return num // 这里相当于resolve(num)
} else {
throw num // 这里相当于reject(num)
}
} imAsync(1).then(function (v) {
console.log(v); // 1
}); // 注意这里是catch
imAsync(0).catch(function (v) {
console.log(v); // 0
})

  

3.await

await不会单独使用,他会和async一起使用, 如果直接使用await的话会不起作用,

await会暂停当前async函数的执行,等待后面的Promise的计算结果返回以后再继续执行当前的async函数

使用场景:

在发起请求获取数据的时候,如果个return返回数据, 这时就需要用到await

async test(){
const currentArr = []
await this.$axios
.get("/topsellerCategorys/", {
marketplaceID: item.value,
listname: "AnyDepartment"
})
.then(response => {
if (response && response.data) {
currentArr = response.data
);
}
})
.catch(error => {
this.loadingShow = false;
console.log(error);
});
if (this.fristCategory[0] && this.fristCategory[0].length) {
this.selectArr = [this.fristCategory[0][0].label]; //类目默认赋值
this.category = this.fristCategory[0][0].label; //选择的类目命默认赋值
}
return currentArr
}

  

  

promise和async/await的用法的更多相关文章

  1. 异步操作之 Promise 和 Async await 用法进阶

    ES6 提供的 Promise 方法和 ES7 提供的 Async/Await 语法糖都可以更好解决多层回调问题, 详细用法可参考:https://www.cnblogs.com/cckui/p/99 ...

  2. promise 进阶 —— async / await 结合 bluebird

    一.背景 1.Node.js 异步控制 在之前写的 callback vs async.js vs promise vs async / await 里,我介绍了 ES6 的 promise 和 ES ...

  3. Promise 和async/await 的使用理解

    Promise 和async/await 的使用理解 1. new Promise时就会开始执行语句. new Promise(resolve => resolove('成功信息') )     ...

  4. 20分钟带你掌握JavaScript Promise和 Async/Await

    转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. 原文出处:https://www.freecodecamp.org/news/learn-promise-a ...

  5. Promise和async await详解

    本文转载自Promise和async await详解 Promise 状态 pending: 初始状态, 非 fulfilled 或 rejected. fulfilled: 成功的操作. rejec ...

  6. node.js异步控制流程 回调,事件,promise和async/await

    写这个问题是因为最近看到一些初学者用回调用的不亦乐乎,最后代码左调来又调去很不直观. 首先上结论:推荐使用async/await或者co/yield,其次是promise,再次是事件,回调不要使用. ...

  7. Promise, Generator, async/await的渐进理解

    作为前端开发者的伙伴们,肯定对Promise,Generator,async/await非常熟悉不过了.Promise绝对是烂记于心,而async/await却让使大伙们感觉到爽(原来异步可以这么简单 ...

  8. Promise及Async/Await

      一.为什么有Async/Await? 我们都知道已经有了Promise的解决方案了,为什么还要ES7提出新的Async/Await标准呢? 答案其实也显而易见:Promise虽然跳出了异步嵌套的怪 ...

  9. callback vs async.js vs promise vs async / await

    需求: A.依次读取 A|B|C 三个文件,如果有失败,则立即终止. B.同时读取 A|B|C 三个文件,如果有失败,则立即终止. 一.callback 需求A: let read = functio ...

随机推荐

  1. 获取树莓派ip地址的方法

    1.有显示器​ (1)鼠标停留在屏幕右上角网络图标上,2-3秒会显示网络连接信息​(2) 图形界面下打开终端运行ifconfig命令 2.登录路由器​查看名叫raspberry的设备 3.电脑上运行命 ...

  2. 【leetcode】1220. Count Vowels Permutation

    题目如下: Given an integer n, your task is to count how many strings of length n can be formed under the ...

  3. js-计算textarea可剩余的字数???

    效果图 HTML: JS:

  4. 16. ClustrixDB Rebalancer

    管理平衡 Clustrix Rebalancer被设计成自动作为后台进程运行,以便跨集群重新平衡数据.介绍如何配置和监视rebalancer,但是大多数部署不需要用户干预. Rebalancer主要通 ...

  5. JavaScript动态创建script标签并执行js代码

    <script> //创建一个script标签 function loadScriptString(code) { var script = document.createElement( ...

  6. MongoDB基本操作(增删改查)

    基本操作      基本的“增删查改“,在DOS环境下输入mongo命令打开shell,其实这个shell就是mongodb的客户端,同时也是一个js的编译器,默认连接的是“test”数据库.  

  7. (53)LINUX应用编程和网络编程之八Linux网络基础

    3.8.1.网络通信概述 3.8.1.1.从进程间通信说起:网络域套接字socket,网络通信其实就是位于网络中不同主机上面的2个进程之间的通信. 3.8.1.2.网络通信的层次 (1)硬件部分:网卡 ...

  8. Harmonic Number (II)

    Harmonic Number (II)   PDF (English) Statistics Forum Time Limit: 3 second(s) Memory Limit: 32 MB I ...

  9. oracle 数据库优化【转载】

    版权声明:本文为CSDN博主「咫尺的梦想ing」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明.原文链接:https://blog.csdn.net/u01305 ...

  10. 探究重构代码(Code refactoring)

    Code refactoring 是什么 在不改变软件的外部行为的条件下,通过修改代码改变软件内部结构,将效率低下和过于复杂的代码转换为更高效.更简单和更简单的代码. 怎样执行Code refacto ...