一、对小程序的request的封装写过小程序的应该知道，微信的request不封装基本上不能用，写的显的太冗长，而且是回调式的，回调地狱什么的就不说了，可读性差。下面是我的封装代码，顺便支持一下promise。function baseRequest({ url, method, header, data, complete }, resolve, reject) {wx.request({url,method,header,data,success: function (res) {// 需要判断服务器code的用这一段// 我司服务器返回0表示真正的成功，其他co...
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> *{ margin: 0; padding: 0; list-style: none; } .box{ height: 15px; margin-top: 20px; transform: translateX(-100%); transition: all 1s linear; } button{ margin-top: 30px; } </style> ...
在我们传统的Javascript开发函数编写中，我们习惯了回调函数的处理，不过随着回调函数的增多，以及异步处理的复杂性等原因，代码越来越难读，因此诞生了使用Promise来优化JS函数处理的需求，引入Promise确实能够很好的解决异步回调函数的可读性等问题，同时也使得我们调用的时候代码简洁一些，本文介绍如何在小程序的JS代码里面使用Promise来封装一些函数的做法。 1、小程序传统的回调处理 例如我们生成一个小程序，里面的app.js里...
本文实例为大家分享了vue实现压缩图片预览并上传的具体代码，供大家参考，具体内容如下 主要用到filereader、canvas 以及 formdata 这三个h5的api过程大致分为三步： 用户使用input file上传图片的时候，用filereader读取用户上传的图片数据（base64格式） 把图片数据传入img对象，然后将img绘制到canvas上，再调用canvas.toDataURL对图片进行压缩 获取到压缩后的base64格式图片数据，转成二进制塞入formdata，再通过XmlHttpReques...
本文介绍了详解promise.then,process.nextTick, setTimeout 以及 setImmediate的执行顺序，分享给大家，具体如下： 先举一个比较典型的例子： setImmediate(function(){console.log(1); },0); setTimeout(function(){console.log(2); },0); new Promise(function(resolve){console.log(3);resolve();console.log(4); }).then(function(){console.log(5); }); console.log(6); process.nextTick(function(){console.log(7); }); con...
关键词：async 、await、promise这三个东西 可以优雅的解决异步问题。在学习koa2的时候遇到了获取数据后再进行模板渲染的异步问题。在查找各种资料后成功的解决了该问题，现在写个笔记记录一下。 先说一下async、await，第一次见到这两个词是在学习vue的时候。因为前端在写代码的时候经常的会遇到向后台请求数据这样的场景，等待数据返回才可以进行下一步的操作。这就不得不处理异步这种情况。 async、await基本的语法就是： let a...
koa 是一个非常轻量优雅的 node 应用开发框架，趁着双十一值班的空当阅读了下其源代码，其中一些比较有意思的地方整理成文与大家分享一下。 洋葱型中间件机制的实现原理 我们经常把 koa 中间件的执行机制类比于剥洋葱，这样设计其执行顺序的好处是我们不再需要手动去管理 request 和 response 的业务执行流程，且一个中间件对于 request 和 response 的不同逻辑能够放在同一个函数中，可以帮助我们极大的简化代码。在了解其实现原理...
下面给大家介绍vue中promise的使用promise是处理异步的利器，在之前的文章《ES6之promise》中，我详细介绍了promise的使用， 在文章《js动画实现&&回调地狱&&promise》中也提到了promise的then的链式调用， 这篇文章主要是介绍在实际项目中关于异步我遇到的一些问题以及解决方法，由此来加深对promise的进一步理解。 背景进入商品页，商品页的左侧是分类，右侧是具体的商品，一旦进入商品页，就把所有分类的商品请求出来，注意： 必...
1. js实现动画 <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>animate</title><style>.ball {width: 40px;height: 40px;margin-bottom: 5px;border-radius: 20px;}.ball1 {background: red;}.ball2 {background: blue;}.ball3 {background: yellow;}</style> </head> <body><div class="ball ball1" style="margin-left: 0"></div><div class="ball ball2" style="margin-left: 0"></div><div class="ball...
场景有a、b、c三个异步任务，要求必须先执行a，再执行b，最后执行c且下一次任务必须要拿到上一次任务执行的结果，才能做操作思路我们需要实现一个队列，将这些异步函数添加进队列并且管理它们的执行，队列具有First In First Out的特性，也就是先添加进去的会被先执行，接着才会执行下一个(注意跟栈作区别)大家也可以类比一下jQuery的animate方法，添加多个动画也会按顺序执行 解决模拟3个异步函数 // 异步函数a var a = function ...
前言 我们在开发过程中大多会用到promise，想必大家对promise的使用都很熟练了，今天我们就来实现一个简单的promise，实现的效果如有出入还往指正。 Promise/A+规范：首先重新阅读了下A+的规范:promise代表了一个异步操作的最终结果，主要是通过then方法来注册成功以及失败的情况，Promise/A+历史上说是实现了Promise/A的行为并且考虑了一些不足之处，他并不关心如何创建，完成，拒绝Promise，只考虑提供一个可协作的then方法。术语...
把微信小程序异步API转化为Promise。用Promise处理异步操作有多方便，谁用谁知道。微信官方没有给出Promise API来处理异步操作，而官方API异步的又非常多，这使得多异步编程会层层回调，代码一复杂，回调起来就想砸电脑。于是写了一个通用工具，把微信官方的异步API转化为Promise，方便处理（多）异步操作。 你可以这样用： 准备转化后的方法并暴露出 // /utils/wx-promise.js import toPromise from /module/to-promise/src/index...
现在应该大部分公司都是前后端分离了。so，数据请求的封装还是必须的。 为了实现向ios中block封装请求的异步的效果，我采用JavaScript中promise这个对象。var p1 = New promise((resolve,reject)=>{var timeOut = Math.random() * 2;log(set timeout to: + timeOut + seconds.);setTimeout(function () {if (timeOut < 1) {log(call resolve()...);resolve(200 OK);}else {log(call reject()...);reject(timeout in + timeOut +...
异步之Promise Promise.all Promise.all接收的promise数组是按顺序执行的还是一起执行的，也就是说返回的结果是顺序固定的吗？ 目前有两种答案： 应该是同步执行的，但是这样就有效率问题了，如果想改成异步执行怎么办呢？有些人认为结果是按顺序执行的，有些人认为结果顺序不确定。那么我们根据实现来解密： 环境为: vscode 1.20.1 node v8.9.0 npm v5.6.0实验代码： // 获取随机数，toFixed为四舍五入保留小数，0为保留整数，范...
昨天写了个小爬虫，用axios.all同时请求多个页面时，国内网络的原因很容易就超时然后reject了，佛系resolve不可取啊，然后想到可以实现一个“重发失败请求”的功能。 Promise.all(requestPromises).then(...).catch(...) 会在所有requestPromises都resolve时才会进then方法，并且把所有结果以一个数组返回。只要有一个失败，就会进catch。如果在单个请求中定义了catch方法，那么就不会进Promise.all的catch方法。因此，可以在单个的...