promise ,async/await的基础用法

简介: promise ,async/await的基础用法
// setTimeout(() => {
//     console.log(1)
//     setTimeout(() => {
//         console.log(2)
//         setTimeout(() => {
//             console.log(3)
//             setTimeout(() => {
//                 console.log(4)
//                 setTimeout(() => {
//                     console.log(5)
//                 }, 1000)
//             }, 1000)
//         }, 1000)
//     }, 1000)
// }, 1000);
var setTimeoutPromise = (time) => new Promise((resolve, reject) => {
    setTimeout(() => { resolve() }, time)
});
// setTimeoutPromise(1000).
//     then(() => { console.log(1); return setTimeoutPromise(1000) }).
//     then(() => { console.log(2); return setTimeoutPromise(1000) }).
//     then(() => { console.log(3); return setTimeoutPromise(1000) }).
//     then(() => { console.log(4); return setTimeoutPromise(1000) }).
//     then(() => { console.log(5)});
var task = async (count) => {
    for (var i = 1; i <= count; i++) {
        await setTimeoutPromise(1000);
        console.log(i);
    }
}
async function taskAll(){
    await task(20);
    console.log('task Finish');
}
taskAll();
// 协程->线程->进程
// JS 单线程异步非阻塞模型
// EventLoop来实现它
// function timeOutTrunk(time) {
//     return (cb) => {
//         setTimeout(cb, time, time);
//     }
// }
// var gen = function* () {
//     var f1 = yield timeOutTrunk(1000);
//     console.log(f1);
//     var f2 = yield timeOutTrunk(f1 + 1000);
//     console.log(f2);
// }
// var g = gen();
// var result = g.next();
// result.value((time) => {
//     var r = g.next(time);
//     r.value((time) => {
//         var _r = g.next(time);
//         console.log(_r.done);
//     })
// })
// TODO:如何用递归来实现一个自动化的执行器?
// var a = new Promise((resolve, reject) => {
//     setTimeout(() => {
//         resolve('yeah')
//     }, 1000);
// });
// var b = (value) => {
//     return new Promise((resolve, reject) => {
//         setTimeout(() => {
//             resolve('b!');
//         }, 3000);
//     })
// }
// // a.then(b).then((v) => { console.log('yeah!') });
// // Promise.all([a, b()]).then(v => console.log(v));
// Promise.race([a, b()]).then(v => console.log(v));
相关文章
|
1月前
|
前端开发 JavaScript 开发者
Async 和 Await 是基于 Promise 实现
【10月更文挑战第30天】Async和Await是基于Promise实现的语法糖,它们通过简洁的语法形式,借助Promise的异步处理机制,为JavaScript开发者提供了一种更优雅、更易于理解和维护的异步编程方式。
31 1
|
1月前
|
前端开发
如何使用async/await解决Promise的缺点?
总的来说,`async/await` 是对 Promise 的一种很好的补充和扩展,它为我们提供了更高效、更易读、更易维护的异步编程方式。通过合理地运用 `async/await`,我们可以更好地解决 Promise 的一些缺点,提升异步代码的质量和开发效率。
35 5
|
1月前
|
前端开发 JavaScript
async/await和Promise在性能上有什么区别?
性能优化是一个综合性的工作,除了考虑异步模式的选择外,还需要关注代码的优化、资源的合理利用等方面。
40 4
|
1月前
|
JSON 前端开发 JavaScript
浅谈JavaScript中的Promise、Async和Await
【10月更文挑战第30天】Promise、Async和Await是JavaScript中强大的异步编程工具,它们各自具有独特的优势和适用场景,开发者可以根据具体的项目需求和代码风格选择合适的方式来处理异步操作,从而编写出更加高效、可读和易于维护的JavaScript代码。
34 1
|
2月前
|
前端开发 JavaScript UED
深入了解JavaScript异步编程:回调、Promise与async/await
【10月更文挑战第11天】深入了解JavaScript异步编程:回调、Promise与async/await
24 0
|
7月前
|
前端开发 JavaScript
如何处理 JavaScript 中的异步操作和 Promise?
如何处理 JavaScript 中的异步操作和 Promise?
73 1
|
7月前
|
前端开发 JavaScript
在JavaScript中,什么是promise、怎么使用promise、怎么手写promise
在JavaScript中,什么是promise、怎么使用promise、怎么手写promise
108 4
|
7月前
|
前端开发 JavaScript 开发者
JavaScript 中的异步编程:Promise 和 Async/Await
在现代的 JavaScript 开发中,异步编程是至关重要的。本文将介绍 JavaScript 中的异步编程概念,重点讨论 Promise 和 Async/Await 这两种常见的处理异步操作的方法。通过本文的阐述,读者将能够更好地理解和应用这些技术,提高自己在 JavaScript 开发中处理异步任务的能力。
|
6月前
|
前端开发 JavaScript 开发者
JavaScript进阶-Promise与异步编程
【6月更文挑战第20天】JavaScript的Promise简化了异步操作,从ES6开始成为标准。Promise有三种状态:pending、fulfilled和rejected。基本用法涉及构造函数和`.then`处理结果,如: ```javascript new Promise((resolve, reject) =&gt; { setTimeout(resolve, 2000, &#39;成功&#39;); }).then(console.log); // 输出: 成功
101 4
|
7月前
|
JSON 前端开发 JavaScript
【JavaScript技术专栏】JavaScript异步编程:Promise、async/await解析
【4月更文挑战第30天】JavaScript中的异步编程通过Promise和async/await来解决回调地狱问题。Promise代表可能完成或拒绝的异步操作,有pending、fulfilled和rejected三种状态。它支持链式调用和Promise.all()、Promise.race()等方法。async/await是ES8引入的语法糖,允许异步代码以同步风格编写,提高可读性和可维护性。两者结合使用能更高效地处理非阻塞操作。
118 0