评论

小程序编码规范浅谈:只为抛砖引玉,一起完善维护小程序编码规范

每门成熟的语言基本都会拥有自己的编码规范,虽然一般官方不会强制要求,但是作为一名码哥,能规范一点,对以后的代码维护绝对是百利而无一害。特别是大的团队项目时,不想被队友心里骂娘的话,好好自律的规范自己的

每门成熟的语言基本都会拥有自己的编码规范,虽然一般官方不会强制要求,但是作为一名码哥,能规范一点,对以后的代码维护绝对是百利而无一害。特别是大的团队项目时,不想被队友心里骂娘的话,好好自律的规范自己的代码是老铁们编码路上不能绕过的坎。下面,个人整理的,很简单的也不全面的一些规范,只为抛砖引玉,让大家一起完善维护小程序这门编程语言的一些编码规范(PS:本文会一直更新,改进,纠正。大神跳过,觉得水文的也请跳过):

.wxml代码规范

1、缩进:以空格代替tab,1个缩进=2个空格
2、标签属性控制顺序 逻辑代码>标签属性>自定义数据值>class>style。

	2.1 逻辑代码包括不限于:wx:if,wx:for,wx:else,wx:hidden,wx:for-item等..超过一行时使用单独的<block></block>

	2.2 标签属性举例:<scroll-view></scroll-view>标签的scroll-y属性

	2.3 自定义数据值举例:data-index="{{xxx}}" ,data-id="{yyyy}:这种以data-开头的

	2.4 自定义数据值个数尽量不超过3个,对应的值总长度不超过12个字符,标识不超过20

3、wx:for循环和wx:if嵌套尽量不超过2层,如果有嵌套,指定层级item和index值,如 wx:for-item=“item1” wx:for-index=“index1”。超过2层嵌套时请在wxs里单独处理或者在js里预处理数据。

4、相关key一律小写,value以小驼峰方式命名,比如 data-canuse="{{canUse}}"

5、自定义组件命名统一以cp开头,如<cp-myview></cp-myview>

6、尽量使用catch代替bind绑定,比如catchtouchmove代替bindtouchmove,阻止冒泡时很多情况下可以提升性能

.小程序js编码规范

1、强类型检查:=== 代替 ==,!==代替!=

2、相关命名规则

	2.1 变量以及方法/函数命名:小驼峰命名法,如 let orderIndex=1;
	2.2 类命名:大驼峰命名法,如 Class Student{}
	2.3 Storage的Key命名:统一大写+下划线方式,如USER_OPENID:wx.setStorageSync('USER_OPENID', res.result.openid);
	2.4 命名时,应该要使变量名具有代表意图的象征,使人易于搜索并且容易理解。
	2.5 不要在名字中增加没必要额外的单词,比如name要写成theName
	2.6 命名时不要加上下文重复的单词

3、其他参考:

	3.1、变量命名采用驼峰法
	3.2、用空格代替tab
	3.3、字符串采用单引号
	3.4、语句结束带分号
	3.5、对象最后一个属性结束带逗号
	3.6、采用字符串模板处理字符串拼接
	3.7、优先选择箭头函数
	3.8、杜绝使用var,with,eval
	3.9、常量命名采用大写
	3.10、优先选择解构赋值
	3.11、对象初始化优先选择简写方式
	3.12、循环遍历优先选择for/of
	3.13、优先选择使用const修饰变量
	3.14、运算符前后加空格
(出处:JS代码规范总结 - 活石之子 - 博客园 https://www.cnblogs.com/zhang134you/p/11727581.html)

4、其他参考

【译】js代码规范-最佳实践 - 简书

https://www.jianshu.com/p/2346cb6b7279

.wxss代码规范

等你补充…

最后一次编辑于  2020-05-01  
点赞 2
收藏
评论

2 个评论

登录 后发表内容