一.异步

同步：

同步的思想是：所有的操作都做完，才返回给用户。这样用户在线等待的时间太长，给用户一种卡死了的感觉（就是系统迁移中，点击了迁移，界面就不动了，但是程序还在执行，卡死了的感觉）。这种情况下，用户不能关闭界面，如果关闭了，即迁移程序就中断了。

异步：

将用户请求放入消息队列，并反馈给用户，系统迁移程序已经启动，你可以关闭浏览器了。然后程序再慢慢地去写入数据库去。这就是异步。但是用户没有卡死的感觉，会告诉你，你的请求系统已经响应了。你可以关闭界面了。

同步，是所有的操作都做完，才返回给用户结果。即写完数据库之后，在相应用户，用户体验不好。

异步，不用等所有操作等做完，就相应用户请求。即先相应用户请求，然后慢慢去写数据库，用户体验较好。

我们知道，JavaScript是单进程执行的，同步操作会对程序的执行进行阻塞处理。比如在浏览器页面程序中，如果一段同步的代码需要执行很长时间（比如一个很大的循环操作），则页面会产生卡死的现象。

所以，在JavaScript中，提供了一些异步特性，为程序提供了性能和体验上的益处，比如可以将代码放到setTimeout()中执行；或者在网页中，我们使用Ajax的方式向服务器端做异步数据请求。这些异步的代码不会阻塞当前的界面主进程，界面还是可以灵活的进行操作，等到异步代码执行完成，再做相应的处理。

一段典型的异步代码类似这样：

然后我们这样调用：

这是一种使用了回调函数来控制代码执行流程的方式。这样看起来没问题，也挺容易理解。

但是，如果我们一段代码中，异步操作太多，又要保证这些异步操作是有顺序的执行，那我们的代码就看起来非常糟糕，就像这样：

这样的代码可读性和可维护性可想而知了。还有，回调函数真正的问题在于：

那有什么办法来改善这个问题呢？答案是肯定的，Promise这种概念的产生，很好地解决了这一切。关于什么是Promise，一搜一大把介绍，我这里就不复制粘贴了，我主要是讲一下我们怎么用它来解决我们的问题。

我们来看一下，上面的例子如果使用Promise，它会是什么样子我们先将这些函数变成Promise的方式：

然后看一下他们是怎么样被调用的：

这样，这些异步函数就会按照顺序一个一个依次执行了。

ES6中原生支持了Promise，不过在原生不支持Promise的环境中，我们有很多第三方库来支持，比如Q.js和Bluebird。它们一般都除了提供标准Promise的API外，还提供了一些标准之外但非常有用的API，使得异步流程的控制更加优雅。

从微信小程序的API文档中我们可以看到，框架提供的JavaScript API中很多函数其实都是异步的，如wx.setStorage(), wx.getStorage(), wx.getLocation()等等，它们也是提供的回调的处理方式，在参数中传入success, fail，complete回调函数，就可以对运行成功或失败进行分别处理。

如：

我们能不能让微信小程序的异步API支持Promise呢？答案是肯定的，我们当然可以一个一个的用Promise去包装这些API，但是这个还是比较麻烦的。不过，由于小程序的API的参数格式都比较统一，只接受一个object参数，回调都是在这个参数中设置，所以，这为我们的统一处理提供了便利，我们可以写一个非侵入性的工具方法，来完成这样的工作：

假设我们将这个工具方法写到一个名为的util.js的文件中：

之后，我们来看一下如何使用这个方法，将原来回调方式的API变成Promise的方式：

2.微信小程序推送消息

在开发小程序 模板消息定时推送功能时，在开发版测试程序功能运行正常，但提交到线上后提示报错{“errcode”:41030,”errmsg”:”invalid page Shopfant: [gP1eXXXXXX]”}

查看小程序文档查看到 如下说明：

可以得到，报错的原因问page不正确，我配置的page为：

/pages/detail/detailid=8a2b978c61db4d5a01621a313e842331

正确的做法是：

pages/detail/detailid=8a2b978c61db4d5a01621a313e842331

去除pages前面的/就可以解决此问题；

3.textarea层级问题

问题重现： 当你一个页面有一个textarea的组件的时候，出现一个弹层，你的

textarea的placeholder的内容是弹层上面的，我们可以当弹层出来的时候，给这个textarea的组件隐藏起来，比如说

但是 这是不可取的，无法解决这个问题，隐藏节点的方式不行，那只能销毁节点了，正确的姿势如下。

解决办法：

当弹层出来的时候的，把textarea的节点wx:if=”{{false}}” ，同时实时获取textarea输入的内容，有个bindinput的实时获取值的方法，保存在一个变量中(content)，同时要给这个textarea添加一个父级，把高度撑起来，弹层一消失

4.mpvue框架

今天先来讲解scroll-view组件，scroll-view为滚动视图，分为水平滚动和垂直滚动。注意滚动视图垂直滚动时一定要设置高度否则的话scroll-view不会生效。

主要属性：

一.scroll-view失效

原因：

1.第一个误区：height不能使用百分百。

2.scroll-into-view 的属性值必须是动态获取的，不能写死。

在一开始的时候，想要测试scroll-into-view的作用，就把scroll-into-view的ID写死，结果然并卵

后来发现，不是这个功能不好用，而是要在组件布局完成后，动态的改变这个scroll-into-view的值，才会跳到索引位置

二.scroll-into-view失效

原因：

由于使用了mpvue框架，scroll-into-view属性在scroll-view组件中失效。

真实案例：

问题一：当tab没有吸顶时，下面的scroll-view可以滑动。iphone X的tab不能置顶。

原因：使用scroll-view 组件时，scroll-y的属性值为true,默认向下滚动，当tab标题栏没有吸顶时，触摸到scroll-view组件时，会自动向下滚动。

iphone X不能置顶因为scroll-view的高度没有达到iphone X的屏高。

解决方案：首页解决scroll-view的固定高度的问题，由于机型的不同，屏高也不相同，所以scroll-view的高度选择动态高度，一打开小程序时，用wx.getSystemInfo()异步获取到屏幕的高度。

将获取到的屏幕高度值赋给scroll-view,在屏幕没有吸顶时scroll-y的值为false,吸顶之后为true.

解决方案二：废弃scroll-view组件，使用wx.pageScrollTo({})