vue next-tick 设计思想

前因

最近学习vue源码，补充下源码知识，顺便读到了next-tick.js代码，就分享下实际用例。

思想

众说周知，vue的next-tick其实是一个优雅降级的方法，从promise==>MutationObserver==>setImmediate==>setTimeout的一个降级处理。

思想借鉴-开发通用型sdk

假如开发一套sdk，这个sdk实现这样的一个功能，调用sdk的chooseImage函数，假如当前在微信公众号上，就调用wx.chooseImage函数；在微信小程序上，就调用wx.mini.chooseImage方法：假如当前是支付宝生活号上，就调用AlipayJSBridge.call('chooseImage',{},fn)的方法。

当前困境

调用chooseImage,需要同时判断多个环境，这个是很麻烦的，而且随着api的增加，愈发的沉重。

解决办法

1. 先确定env变量（环境变量）
2. 后续访问api时，查找${env}-${api}这个api时是否存在，如果存在就直接调用；否则抛出catch异常（也可以创建空函数，内部抛出异常）。

造成的问题

1. 需要对相关的平台创建对应的文件，代码量大
2. 方法类庞大，冗余（其他平台的方法也存在）

进阶

对于问题1其实没办法解决的，那么就处理问题2。 我们确定好env以后，直接执行对应的js文件，直接把方法添加到类上。（减少了类的方法）

总结

学以致用，才是最好的学习方式。学习优雅降级处理逻辑。