小程序的功能不断的增加,但是旧版本的微信客户端并不支持新功能,所以在使用这些新能力的时候需要做兼容。

关于单个 API 如何兼容,微信官方提供了兼容文档,因此我们这里不再赘述。
下面主要讨论在整个项目如何优雅地处理兼容问题

问题

如果在每处需要兼容的地方都写上一堆兼容相关的代码,随着代码量增加,会出现以下问题:

  • 代码难以阅读
  • 兼容方案有变动时,需要改动多处
  • 随着时间推移,你的代码才是最需要并且是最难兼容的

思考

最理想的情况是不需要任何兼容处理,因此可以反推出兼容性处理的代码并不是代码正常流程中的一部分,基于此:

  • 兼容的细节不必暴露
  • 兼容的方案应该统一
  • 兼容的方案可方便地变动

解决方案

1.将兼容方案隐藏,对外提供接口即可

比如 wx.showLoading 是在 1.1.0 版本之后才提供的,对于之前的版本需要兼容。
我们选择将其放在 show-loading.js 中,内部进行兼容性相关处理,并对外提供 showLoading 方法。
这样调用者只需调用 showLoading 方法即可,不用考虑兼容性的问题,而且如果兼容的方式有变动,只需改动 show-loading.js 一处即可。

2.兼容的处理还有共性可以抽象

兼容处理多了之后我们会发现,对兼容所做的处理无非两方面:

  • 支持该方法时,直接使用对应方法
  • 不支持该方法时,做一些兼容处理

因此这种模式我们又可以抽离出来,这样做当然有一些好处:

  • 减少重复代码
  • 做一些共性的处理时,我们又只用改动一处(比如当不兼容官方 API 时加上对应统计,用于分析当前应用跨版本的情况)

比如我们抽离出这样一个简单的 compatible.js 用于处理兼容时的共性问题:

之前的 showLoading.js 我们可以这样写:

简单吧 :),这种写法的意思是兼容时正常展示 loading 即可,不兼容时则不展示。

当然可能有完美主义者会觉得『怎么能不展示呢?我就是要展示!』 那么我们可以这样写:

wx.showToast 伪造了一个 showLoading

3.文件组织

兼容性的文件可能会越来越多,对于我这种有收拾的人,看到所有东西散乱地扔在一个抽屉里肯定是不能忍的...
因此我们可以多用几个小盒子把它们分门别类地装起来。小盒子怎么选呢?其实官方已经给出了答案,官方 API 是按照不同的功用分组的,因此我们拿分组当『盒子』即可。
最终的文件组织像这样:

微信小程序开发,如何优雅地兼容的更多相关文章

  1. WordPress版微信小程序开发系列(一):WordPress REST API

    自动我发布开源程序WordPress版微信小程序以来,很多WordPress站长在搭建微信小程序的过程中会碰到各种问题来咨询我,有些问题其实很简单,只要仔细看看我写的文章,就可以自己解决.不过这些文章 ...

  2. 微信小程序开发入门教程

    做任何程序开发要首先找到其官方文档,微信小程序目前还在邀请内测阶段,目前官方放出了部分开发文档,经过笔者一天的查看和尝试,感觉文档并不全面,但是通过这些文档已经能够看出其大概面貌了.闲话不多说,我们先 ...

  3. 微信小程序开发库grace vs wepy

    grace和wepy都是辅助小程序开发的开源库,本文对两者做个对比. 注:本文是作者本人的一些拙见,纯粹的技术讨论,不想引起技术信仰之争,欢迎积极.正向的讨论及建议. 如果你还不了解Grace, 请参 ...

  4. 微信小程序开发03-这是一个组件

    编写组件 基本结构 接上文:微信小程序开发02-小程序基本介绍 我们今天先来实现这个弹出层: 之前这个组件是一个容器类组件,弹出层可设置载入的html结构,然后再设置各种事件即可,这种组件有一个特点: ...

  5. 零基础入门微信小程序开发

    注:本文来源于:<零基础入门微信小程序开发> 课程介绍 本达人课是一个系列入门教程,目标是从 0 开始带领读者上手实战,课程以微信小程序的核心概念作为主线,介绍配置文件.页面样式文件.Ja ...

  6. WordPress版微信小程序开发系列(二):安装使用问答

    自WordPress版微信小程序发布开源以来,受关注的程度超过我原来的想象.这套程序主要面对的用户是wordpress网站的站长,如果wordpress站想在微信的生态圈得到推广,小程序成为一种重要的 ...

  7. 微信小程序开发学习资料

    作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...

  8. 总结微信小程序开发中遇到的坑

    总结微信小程序开发中遇到的坑,一些坑你得一个一个的跳啊,/(ㄒoㄒ)/~~ 1,页面跳转和参数传递实例 首先说一下我遇到的需求有一个我的消息页面,里面的数据都是后端返回的,返回的数据大致如下,有一个是 ...

  9. 微信小程序开发教程,大多数人都搞错的八个问题

    小程序目前被炒得沸沸扬扬,无数媒体和企业借机获取阅读流量. 这再次证明一点,微信想让什么火,真的就能让什么火.这种能力真是全中国再也没有人有了,政府也没有. 但四处传的消息很多是失真的,废话不说,先列 ...

  10. 《腾讯游戏人生》微信小程序开发总结

    为打通游戏人生擂台赛与线下商家的O2O衔接,同时响应时下日臻火热的微信小程序,项目团队决定也开发一款针对性的微信小程序,以此方便商家在我们平台入驻并进行擂台赛事的创建和奖励的核销,进一步推广擂台赛的玩 ...

随机推荐

  1. 迅为iTOP-3399开发板Ubuntu基本设置

    基于迅为iTOP3399开发板虚拟机需要根据用户的实际情况,进行网络设置以及其他一些基本的设置.VMware10.0.1 和 Vmware8.0.3 联网和基本设置类似.下面先详细讲解一下,虚拟机的一 ...

  2. 吴裕雄--天生自然C语言开发:文件读写

    #include <stdio.h> int main() { FILE *fp = NULL; fp = fopen("/tmp/test.txt", "w ...

  3. python实现个人信息随机生成

    """ 生成随机姓名.电话号码.身份证号.性别.应行卡号.邮箱 """ import random from firstname impor ...

  4. JAVA循环结构学校上机经常遇到的几题 笔记

    package homework.class4; import java.util.*; import java.util.stream.Collectors; import java.util.st ...

  5. MySQL之数据存储引擎

    1.什么是存储引擎: 现实生活中我们用来存储数据的文件有不同的类型,每种文件类型对应各自不同的处理机制:比如处 理文本用txt类型,处理表格用excel,处理图片用png等,数据库中的表也应该有不同的 ...

  6. centos5.5 下面 lnmp环境遇到的小问题

    A)nginx 启动:/www/nginx/sbin/nginx -c /www/nginx/conf/nginx.conf 查看: ps -ef | grep nginx 停止:强制停止所有Ngin ...

  7. MOOC(8)- 在excel中定义用例是否运行

    除了在配置文件中定义运行哪几条用例,还可以直接在excel中定义好是否运行用例,这样比起配置文件更加直观 在运行用例的时候判断一下是否运行这个字段即可

  8. git 忽略规则

    # 以'#'开始的行,被视为注释. # 忽略掉所有文件名是 foo.txt的文件. foo.txt # 忽略所有生成的 html文件, *.html # foo.html是手工维护的,所以例外. !f ...

  9. 判断两个数组是否相似 (arraysSimilar)

    题目 解答 思路 具体实现代码 总结 题目 题目来自 慕课网 JavaScript 深入浅出 1-6 编程练习 请在 index.html 文件中,编写 arraysSimilar 函数,实现判断传入 ...

  10. 吴裕雄--天生自然HTML学习笔记:HTML 链接

    HTML 链接 HTML 使用超级链接与网络上的另一个文档相连.几乎可以在所有的网页中找到链接.点击链接可以从一张页面跳转到另一张页面. HTML 超链接(链接) HTML使用标签 <a> ...