网站前端开发的代码排版风格

2021-04-11 分类：网站建设

虽然任何一种语言都没有任何约定的风格，但也总有一些不成文且喜闻乐见的习俗。以你的代码为例，给以下几个风格上的建议：

每个function之间多一空行，是的，除去注释外再多一空行；

适当加空格，比如if和后面的括号之间的空格、小括号和花括号之间的空格、冒号和function之间的空格等等；

风格上保持一致，你的代码里面有的地方+号和运算数之间有空格，有的则没有；

少用下划线开头的变量命名；

一段代码里，var语句可以合并在一起；

暂时不会再修改的function或object，先用编辑器折叠起来，看上去也会整洁很多；

黑色背景的editor风格不错，不过关键字、注释、运算符等颜色上可以再调整，主要是为了防止审美疲劳，换个色调换个心情；

使用成熟的javascript库

如果没看错的话，你可能是使用了jquery吧（至少也有一个类似sizzle或更简单的解析器，证据在倒数第十行左右）。所以，就尽可能避免使用原生的javascript.dom操作。

jquery的符号，以cssselector风格统一取代了各种getelement(s)byxxx的接口，并且扩展性非常强，是很多设计模式思想的综合运用。

当然原生dom也有自己的优势（主要是执行效率），但是大部分时候，在开发效率、代码质量、执行效率的tradeoff中，jquery还是好选择。此外也推荐下javascript.mvc库、jqueryui库等等。

代码整理
构思清楚，再写代码，你已经做到了。
但是，谁能保证代码是一成不变、一劳永逸的呢？
所以，「重构」的时候，除非是时间紧迫，永远不要松懈代码质量。
web前端爱好者toobug对楼主的代码也进行了详细的点评，并且也给出了一些非常有意义的指导：

代码中逻辑没有分块、没有空行、没有注释、看起来很累，建议对代码进行分块，比如将变量集中在头部定义，然后处理一些赋值，最后执行一些其它的函数。具体到这个例子，有很多不恰当的地方，比如可以先var_height；然后在条件分支中进行赋值，比如在一堆赋值语句中间夹杂了一个parsetemplate。

“_”用得太多，this._var这个可以理解，因为要区分是否私有变量，但是var_height这个完全没有必要加，加得太多反而看着很累，而且也没有任何区分的意义。

没有将常用的变量缓存，这里最应该缓存的是this._options，要不然看起来很乱，而且缓存起来对性能也是有好处的。

对象的规划（命名）不清晰，比如this._options和this.opts什么关系？我反正是看不明白。

代码风格不统一。

函数内变量名混乱（和第四点很像），比如第二个函数中id和_id什么关系？为什么不用aaaid和bbbid？cre又是什么，难道是createelement缩写？变量尽量起有意义的，可区分的名字。

函数名称表义不明，命名不符合大部分规范约定。第一眼看到_ishavetable，我第一反应是，这应该是类似returntrue或者returnfalse之类的吧。结果一看，这么长，难道返回在后面？又往后看了一眼，这根本就没有返回啊！那为什么要用_ishavetable啊？_is开头的函数明明白白就应该返回一个true或者false啊。

文章题目：网站前端开发的代码排版风格
分享地址：https://www.cdcxhl.com/news/106872.html

成都网站建设公司_创新互联，为您提供企业网站制作、域名注册、云服务器、营销型网站建设、网站内链、网站制作

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容