`
yuyongkun4519
  • 浏览: 45213 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

JavaScript异步编程解决方案Promise、Generator、Async

阅读更多

下面通过按顺序读取本地文件data/1.txt-->data/2.txt-->data/3.txt三个问题来介绍三者的使用方式和差别



 1,使用Promise实现

const fs = require('fs');

function readFile(filename) {
    return new Promise((resolve, reject) => {
        fs.readFile(filename, (err, data) => {
            if (err) {
                reject(err);
            } else {
                resolve(data);
            }
        });

    });
}

readFile('data/1.txt').then(res => {
    console.log(res.toString());
    return readFile('data/2.txt');
}).then(res => {
    console.log(res.toString());
    return readFile('data/3.txt');
}).then(res => {
    console.log(res.toString());
});

 2,使用Generator的方式实现

const fs = require('fs');

function readfile(pathname) {
    return new Promise((resolve, reject) => {
        fs.readFile(pathname, (err, data) => {
            if (err) {
                reject(err);
            } else {
                resolve(data);
            }
        });

    });
}

function* gen() {
    yield readfile('data/1.txt');
    yield readfile('data/2.txt');
    yield readfile('data/3.txt');
}
let g1 = gen();
g1.next().value.then(res => {
    console.log(res.toString());
    return g1.next().value;
}).then(res => {
    console.log(res.toString());
    return g1.next().value;
}).then(res => {
    console.log(res.toString());
});

 

3,使用Async的方式实现

const fs = require('fs');

function readfile(pathname) {
    return new Promise((resolve, reject) => {
        fs.readFile(pathname, (err, data) => {
            if (err) {
                reject(err);
            } else {
                resolve(data);
            }
        });

    });
}
async function asy() {
    let a = await readfile('data/1.txt');
    let b = await readfile('data/2.txt');
    let c = await readfile('data/3.txt');
    console.log(a.toString(), b.toString(), c.toString());
}
asy();

 

async特点

1,await要放在async函数体中

2,比generator更加语义化

3,await后面可以是promise对象,也可以是数字,字符串和布尔值

4,只要await语句后面的Promise状态变成reject,整个async函数会中断执行

 

如何解决async函数里面抛出错误,影响后续执行

async function asy() {
 try{
    let a = await readfile('data/1.txt');
    let b = await readfile('data/2.txt');
    let c = await readfile('data/3.txt');
    console.log(a.toString(), b.toString(), c.toString());
  }catch(e){} 
} 
asy(); 
  • 大小: 8.1 KB
分享到:
评论

相关推荐

    藏经阁-JavaScript异步编程.pdf

    异步编程的解决方案有多种,包括回调函数、Promise、Generator和Async/Await等。 单线程异步 JavaScript语言的单线程特点决定了它只能在某个特定的时刻执行特定的代码,并阻塞其他代码。这也意味着同一个时间只能...

    Javscript高性能编程+Javascript异步编程

    6. **Async Function**:将Generator与Promise结合,简化异步代码编写。 7. **回调函数与错误处理**:异步操作中错误处理至关重要,合理的错误处理策略(如try...catch)能确保程序的健壮性。 8. **Web Workers**...

    JavaScript异步编程

    JavaScript作为单线程语言,其执行模型决定了它不能同时处理多个任务,而是采用事件循环和回调函数、Promise、async/await等机制来实现异步操作。 首先,我们需要理解JavaScript的事件循环(Event Loop)机制。在...

    详解node Async/Await 更好的异步编程解决方案

    最近在学习 Puppeteer 的时候又发现另一种异步编程解决方案:Async/Await. 异步操作是 JavaScript 编程的麻烦事,麻烦到一直有人提出各种各样的方案,试图解决这个问题。 从最早的回调函数,到 Promise 对象,再到 ...

    深入理解JavaScript异步

    在这个教程中,我们将探索JavaScript异步处理的各个方面,包括事件循环、回调函数、Promise、Async/Await以及generator等。 首先,我们来了解异步编程的基本原理。在JavaScript中,由于其单线程的执行模型(即所谓...

    Javacripts异步编程课件

    此外,JavaScript社区也开发了其他基于Promise的异步编程模型,如`async/await`语法。这允许开发者以更加线性和直观的方式编写异步代码,同时解决了回调函数的许多问题,比如更好的错误处理和流程控制。 综上所述,...

    详谈nodejs异步编程

    Promise是一种解决异步编程问题的模式,它代表一个将要完成且不可改变的异步操作的结果。ES6引入了Promise的概念,并且现代浏览器如Chrome和Firefox已经内置实现了Promise对象。Promise有三种状态:pending(等待中...

    javascript异步编程的六种方式总结

    JavaScript 作为一种单线程语言,其异步编程是解决程序执行效率问题的关键。在处理耗时操作时,如网络请求或文件读写,如果采用...随着ES规范的不断发展,Promise和async/await已成为现代JavaScript异步编程的首选。

    javascript个人学习总结:包括数据结构与算法,前端工程化等方面,助你快速入门

    主要内容目录如下: 一。协作规范 中文技术文档协作规范(阮一峰) Javascript编程风格 凹凸实验室前端代码规范 vuejs风格指南 代码安全指南 二....zarm 基于react移动端组件...9k字 | Promise/async/Generator实现原理解析

    javascript高级编程v3

    13. **React/Vue/Angular等前端框架**:这些框架基于JavaScript,提供了一套完整的解决方案来构建现代Web应用,学习其核心概念和API对于提升开发效率非常有帮助。 "JavaScript Advanced Programming(v3).pdf"这份...

    JavaScript 中使用 Generator的方法

    随着JavaScript标准的不断发展,async/await等更加易用的异步编程方案的推出,Generator函数在实际开发中的使用场景可能会进一步减少。尽管如此,对于理解JavaScript底层的异步处理机制、实现复杂控制流程等,学习和...

    前端异步代码解决方案实践(二).docx

    ### 前端异步代码解决方案实践(二) #### 引言 随着现代Web开发的不断演进,异步编程已成为前端开发中的重要组成部分。...未来,我们还将探索更多与异步编程相关的高级话题,如Generator、Async/Await等,敬请期待。

    详谈javascript异步编程

    除了事件和Promise,JavaScript还有其他异步编程方式,如回调函数、Generator、Async/Await等。回调函数是最基础的形式,但容易导致回调地狱;Generator允许我们使用`yield`关键字暂停函数执行,而Async/Await则是...

    【JavaScript源代码】详解ES9的新特性之异步遍历Async iteration.docx

    在JavaScript的世界里,异步编程是处理I/O操作和网络请求等耗时任务的关键。随着语言的不断发展,ES9引入了一项重要的新特性——异步遍历(Async iteration),这使得开发者可以更优雅地处理异步数据流。本文将深入...

    异步调用_Async.rar

    通过回调、事件、Promise、Generator以及async/await等方式,开发者能够有效地管理和控制异步操作,使程序更加高效和健壮。对于这个压缩包,深入研究“Async.swf”文件将有助于深入理解异步编程的实践应用。

    详解ES6之async+await 同步/异步方案

    关于异步方案,ES6先是出现了基于状态管理的Promise,然后出现了Generator函数+co函数,紧接着又出现了ES7的async+await方案。异步编程的几个场景包括: 1. 均匀发生的异步:在for循环中,如何异步的打印迭代顺序?...

    JavaScript 高级编程(成书)

    7. **ES6及后续版本的新特性**:包括箭头函数、解构赋值、模板字符串、let和const、类、模块、Promise、Generator、Async/Await等,这些都是提升代码质量和可读性的现代JavaScript特性。 8. **性能优化**:如何编写...

    asincronismo_javascript_

    4. **async/await**:这是ES7引入的异步编程新语法,基于Promise,提供了更直观的同步代码风格。`async`关键字用来定义一个返回Promise的函数,`await`关键字则用来等待Promise的解决。这种方式使得异步代码的阅读和...

Global site tag (gtag.js) - Google Analytics