NodeJs使用asyncAwait两法

2017-06-17 18:33:17

async/await使用同步的方式来书写异步代码,将异步调用的难度降低到接近于0,未来必将大放异彩。然而在当下,由于标准化的缓存步伐,async/await尚在ES7的草案中。为了尝先,特试用了下面两种方式:

  • 使用社区提供的asyncawait封装

  • 使用ES7草案

使用社区提供的asyncawait模块

Git地址

git@github.com:yortus/asyncawait.git

使用方法:

1.       安装node模块

a)         npm install asyncawait@1.0.3 –save

2.       创建示例类AsyncService.js

var async require('asyncawait/async');
var await require('asyncawait/await');
var sleep async(
    
function sleep(timeout) {
        
return new Promise(function (resolve, reject) {
            
setTimeout(function () {
                resolve();
            }, timeout);
        });
    }
);

(
async(
    
function () {
        
console.log('Do some thing, ' new Date());
        
await(sleep(3000));
        
console.log('Do other things, ' new Date());
    }
))();

3.       运行AsyncService.js

a)         node AsyncService.js

b)         运行结果:

Do some thing, Wed Jun 15 2016 11:09:05 GMT+0800 (中国标准时间)

Do other things, Wed Jun 15 2016 11:09:08 GMT+0800 (中国标准时间)

注意事项

1.       asyncawait模块内部引用bluebird模块.

2.       无须编译为Es5,可直接运行.

使用ES7草案

使用方法:

1.       安装node模块,需要的一系列模块如下:

a)    babel-cli
b)    babel-preset-es2015"
c)    babel-preset-react":
d)    babel-preset-stage-3
e)    babel-polyfill

2.       创建示例类 AsyncAwaitService.js

async function sleep(timeout) {
   
return new Promise((resolve, reject) => {
       
setTimeout(function () {
            resolve();
        }, timeout);
    });
}

(
async function () {
   
console.log('Do some thing, ' + new Date());
   
await sleep(3000);
   
console.log('Do other things, ' + new Date());
})();

                  

3.       编译AsyncAwaitService.js

a)         配置babel

                         i.              package.json中加入babel节点,内容如下:

 

"babel": {
 
"presets": [
   
"es2015",
   
"react",
   
"stage-3"
 
],
 
"plugins": []
}

          

b)         编译

babel AsyncAwaitService.js --out-file AsyncAwaitService_es5.js
或者
babel AsyncAwaitService.js -o AsyncAwaitService_es5.js

c)         标记编译后的代码

     在AsyncAwaitService_es5.js脚本头部加入以下代码:
require('babel-polyfill')

4.       运行AsyncAwaitService_es5.js

a)         node AsyncAwaitService_es5.js

b)         运行结果:

Do some thing, Wed Jun 15 2016 11:54:13 GMT+0800 (中国标准时间)

Do other things, Wed Jun 15 2016 11:54:16 GMT+0800 (中国标准时间)

注意事项

1.       async/await通过babel编译为Es5,方可直接运行.

2.       babel编译相关内容可参考阮一峰博客 http://www.ruanyifeng.com/blog/2016/01/babel.html


  • 2020-05-07 13:42:13

    场景切换的集合移动,旋转,淡入淡出等

    两个场景(即两个div视图)切换的时候,如果想添加个过渡动画,除了可以使用js来实现,还可以通过CSS3的animation属性来实现。 (注意:Internet Explorer 9 以及更早的版本不支持 animation 属性。)

  • 2020-05-07 13:43:02

    css模拟开关按钮

    之前我们为大家分享过很多款各式各样的CSS3开关切换按钮,很多还是非常富有创意的,比如这里的多组超具创意的CSS3开关切换按钮和纯CSS3灯光开关动画。今天我们要带来另外一款外观很漂亮的纯CSS3开关切换按钮动画,它模拟了电灯的开关,并且在开和关之间切换时按钮的背景会有不同的变化,看起来非常不错。

  • 2020-05-07 18:40:35

    CSS让页面平滑滚动

    凡是需要滚动的地方都加一句scroll-behavior:smooth就好了!

  • 2020-05-12 10:17:07

    createElementNS和createElement区别

    指定与元素相关联的命名空间URI的字符串。创建的元素的namespaceURI属性使用namespaceURI的值进行初始化。 参见有效的命名空间URL。

  • 2020-05-13 09:37:50

    transform-origin(变形原点) 怎么用

    transform-origin是变形原点,也就是该元素围绕着那个点变形或旋转,该属性只有在设置了transform属性的时候起作用

  • 2020-05-13 09:56:35

    Could not find method google() for arguments [] on repository container.

    1、打开项目根目录下android/gradle/wrapper/gradle-wrapper.properties 将distributionUrl=https\://services.gradle.org/distributions/gradle-2.14.1-all.zip中的2.14.1改成4.1 ———————————————— 版权声明:本文为CSDN博主「peachesTao」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。 原文链接:https://blog.csdn.net/taoerchun/article/details/93870941

  • 2020-05-13 10:05:23

    inline svg想写介绍以及使用

    inline svg是目前前端图标解决方案的最优解(当然不仅限于图标),而且使用方式也及其简单,只要将svg图标代码当成普通的html元素来使用即可