背景假设:

  你有许多的配置信息存放在服务器上,因为配置太多,不希望每次都把所有的配置信息都写到前端,希望能需要用的时候再获取就好了。

因为Javascript单线程运行,你不希望堵塞ui渲染于是你专门写了个异步获取函数(ajax获取后台信息)

  1. var getConfig=function(key,callback){
    $.get('/config/'+key,function(config){
    callback(null,config);
    },'json');
    };
    //使用该函数
    getConfig(1,function(err,config){
    if(err){
    return console.log(err);
    }
    console.log(config);
    });

于是就可以欢快的使用它了。

  你发现你的Javascript里面调用它的地方很多,每次都发起一个请求太费时间和资源,于是你打算给它加上缓存(为了说明问题,我们不用高阶函数:)  )。

  1. var getConfig = (function () {
  2. var _configs = {};//缓存容器
  3. return function (key, callback) {
  4. if (_configs[key] === undefined) {
  5. $.get('/config/' + key, function (config) {
  6. _configs[key] = config;
  7. callback(null, config);
  8. }, 'json');
  9. } else {
  10. return callback(null,_configs[key]);
  11. }
  12. };
  13. })();

  于是你就可以欢快的使用配置了,获取过的配置都会被缓存。

  问题就出在这里,你运行以下代码

  1. getConfig('db',function(err,config){
  2. console.log(config);//输出2
  3. });
  4. console.log('hello world');//输出1

  在我们添加缓存之前的版本,我们每次运行该代码  都是先输出1,再输出2。但是在我们加了缓存后,假如缓存存在的话,我们的输出就变成了先输出2,再输出1,这样的情况或许在我们的事例中好像没有什么影响,但在有些情景下将会留下一些比较奇怪的bug。

  这里的问题就是一个异步的不一致性问题,解决该问题可以这样。

  1. var getConfig = (function () {
  2. var _configs = {};//缓存容器
  3. return function (key, callback) {
  4. if (_configs[key] === undefined) {
  5. $.get('/config/' + key, function (config) {
  6. _configs[key] = config;
  7. return callback(null, config);
  8. }, 'json');
  9. } else {
  10. setTimeout(function(){//改动的地方
  11. return callback(null,_configs[key]);
  12. },0);
  13. }
  14. };
  15. })();

  我们需要把callback的运行放到下一个tick中才运行,已保持getConfig函数的异步性质。

结论:当封装函数的时候如果是一个异步函数的时候,需要确保函数的回调一直都是异步的。(这里是个新手(如我)常见的小问题,但是养成一种好的习惯,有助于保证代码的健壮性)

PS:如果你需要确保一个函数是一个异步函数,可以考虑下 async 的  async.ensureAsync方法(巧妙的运用同异步的差异实现) https://github.com/caolan/async

  如果你考虑对你的方法做结果缓存,同样可以考虑 async 的 async.memoize方法(更完整,不单单缓存结果,还为高并发情况做了处理多个相同请求并发只会触发一次计算)。

ensureAsync

异步函数封装请确保异步性(Javascript需要养成的良好习惯)的更多相关文章

  1. callback res.end 记得return(Javascript需要养成的良好习惯)

    错误示例: app.get('do',function(req,res,next){ getUserId(function(err,userId){ if(err){ res.end(err);//错 ...

  2. 『审慎』.Net4.6 Task 异步函数 比 同步函数 慢5倍 踩坑经历

    异步Task简单介绍 本标题有点 哗众取宠,各位都别介意(不排除个人技术能力问题) —— 接下来:我将会用一个小Demo 把 本文思想阐述清楚. .Net 4.0 就有了 Task 函数 —— 异步编 ...

  3. Net4.6 Task 异步函数 比 同步函数 慢5倍 踩坑经历

    Net4.6 Task 异步函数 比 同步函数 慢5倍 踩坑经历 https://www.cnblogs.com/shuxiaolong/p/DotNet_Task_BUG.html 异步Task简单 ...

  4. 简述异步编程&Promise&异步函数

    前言:文章由本人在学习之余总结巩固思路,不足之前还请指出. 一.异步编程 首先我们先简单来回顾一下同步API和异步API的概念 1.同步API:只有当前的API执行完成之前,才会执行下一个API 例: ...

  5. 更优雅的方式: JavaScript 中顺序执行异步函数

    火于异步 1995年,当时最流行的浏览器--网景中开始运行 JavaScript (最初称为 LiveScript). 1996年,微软发布了 JScript 兼容 JavaScript.随着网景.微 ...

  6. Node.js用ES6原生Promise对异步函数进行封装

    Promise的概念 Promise 对象用于异步(asynchronous)计算..一个Promise对象代表着一个还未完成,但预期将来会完成的操作. Promise的几种状态: pending:初 ...

  7. JavaScript处理异步请求的几种方式(取异步函数返回值)

    JavaScript处理异步的几种方式 Javascript语言的执行环境是"单线程"(single thread,就是指一次只能完成一件任务.如果有多个任务,就必须排队,前面一个 ...

  8. 获取JavaScript异步函数的返回值

    今天研究一个小问题: 怎么拿到JavaScript异步函数的返回值? 1.错误尝试 当年未入行时,我的最初尝试: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 <s ...

  9. javascript 异步请求封装成同步请求

    此方法是异步请求封装成同步请求,加上token验证,环境试用微信小程序,可以修改文件中的ajax,进行封装自己的,比如用axios等 成功码采用标准的 200 到 300 和304 ,需要可以自行修改 ...

随机推荐

  1. 升级openssl环境至openssl-1.1.0c

    升级openssl环境至openssl-1.1.0c1.查看源版本 [root@zj ~]# openssl version -aOpenSSL 1.0.1e-fips 11 Feb 2013 2.下 ...

  2. 使用Gson转换json数据为Java对象的一个例子

    记录工作中碰到的一个内容. 原料是微信平台的一个接口json数据. { "errcode" : 0, "errmsg" : "ok", &q ...

  3. 【树莓派】树莓派使用4G模块上网

    想了解一下树莓派通过4G网络模块通信如何实现,看到这篇文章(http://www.lxway.com/95811506.htm),准备接下来有机会实践一下,先留存学习: 一.4G Luci配置 1. ...

  4. Ubuntu 14.04下搜狗输入法崩溃重启

    pidof fcitx | xargs kill pidof sogou-qimpanel | xargs kill nohup fcitx >/dev/>/dev/null & ...

  5. Markdown学习和插件介绍

    markdown能干啥 亲们github上的项目首页的 内容+样式,都是项目中README.md文件控制的.将md风格的代码,转化成html. 而且markdown语法非常简单,5-10分钟即可学会! ...

  6. SVN版本号打包脚本工具

    做网页游戏开发的时候,经常会触及到对文件版本号的管理.最近由于做新项目的原因,把原来手写版本号的方法改进了一下,借由svn的版本号生成及用java写了个xml解析输出文件,把手动的东西都变成全自动. ...

  7. build.fxbuild打不开 Failed to create the part's controls

    Failed to create the part's controls 以文本形式打开之后,发现编码的地方不是常用编码 将之修改为GBK 然后就可以正常打开了 最后把eclipse中的编码统一设置为 ...

  8. Android 异步消息处理机制

    1.Handler的由来 当程序第一次启动的时候,Android会同时启动一条主线程( Main Thread)来负责处理与UI相关的事件,我们叫做UI线程. Android的UI操作并不是线程安全的 ...

  9. Apache 403 error, (13)Permission denied: access to / denied问题

    Apache 配置Alias 后,无法访问 CentOS系统 检查了一圈httpd.conf和目录权限,均没有发现问题. 最后,看了这篇文章,发现是因为系统启动了SELINUX导致的. http:// ...

  10. 2016年12月31日 学习java 第一天

    6个月没写代码了 现在从头开是学 又遇到了很基础的问题 以前配环境变量的时候  配过classpath  其实不要配classpath  因为运行的时候会优先去classpath去找 class文件  ...