简单来说，有许多代码在到处放着，当它们没有被组织管理起来，但 更重要的是当它们没有写好时，事情就会变得有点复杂起来。让我们来看一看
网页美工设计培训老师整理的几种能提升我们的代码整体质量的不同方法。
1. 开始构建模块
保持代码一致，可重用且有组织的一个最好方式就是将功能成组的放在一起。例如，别把你所有的js代码都扔到一个main.js文件中，而是要尝试基于功能将它们分组放在分开的文件里面, 然后在你达成你的构建步骤以后再将它们连接起来. 当然，要编写模块化的代码还有更多事情要做，而你也不仅仅只能在用js编写模块化的代码.
CSS 预处理器，像 Sass，它们可以让你 把CSS文件写在分开的文件中，然后可以在你编译它们的时候在把它们包含在一个主文件中. 这可以让你为不同的组件，像按钮，列表和字体编写独立的CSS文件。最后，它们全部都被包含到一个主文件中，而从整体上维护这些代码会变得容易许多.
新的技术，比如 Polymer ，可以让你编写定制的HTML元素，那样你的HTML、CSS和JS就可以根据功能来组织成单独的组件了. 你也一定要看看Browserify (), 它能让你可以在浏览器中使用 Node.js-风格的模块.
Brad Frost 在这里也就编写模块化代码的观念和方法提供了一个很棒的概述.
2. 谈到预处理器
预处理器不仅仅能对编写模块化代码有所帮助. 许多其它方面它们也表现得很棒!
网页美工设计培训老师预处理器可以在输出浏览器可以处理的相同HTML，CSS和JS时，在你的代码内部添加额外的功能. 它们常常需要一些额外的设置时间，但只要耗费一次这样的时间，你就可以不断享受使用它们带来的好处.
使用预处理器可以帮你省掉多次编写重复性代码的时间. 它们也还提供了像变量、函数、循环和简化的语法这些很有用的功能. 大多数预处理器也是高度可定制化的。有些还包含选择你更喜欢的输出风格，包含插件以及附件，甚至在必要时创建自定义通知，这些选项. 最流行的预处理器都有大型的社区，并且得到了良好的维护，而对于一般问题的回答也很容易找到.
当你研究Sass时，一定也要看看 HAML 和 Coffescript 哦.
你不必在每一种你用来编写程序的语言上都用到预处理器，但它们中的许多确实能帮助你写出更好的代码.
3. 开写之前请计划好
你最后一次坐下来用纸笔写下你会如何处理一个项目，是什么时候呢? 你计划选用什么架构，你预期能支持多少中浏览器，你计划了使用任何自动化的运行工具或者构建系统吗？在你想好了具体它如何被构造以后，项目就很容易推进起来了，只有在意识到一半时，你才需要回头重写一些代码.
North 是一套出众的指导你如何从头到尾规划一个web项目的规则. 它是一份长而全面的在线文档，不是所有的东西在编写代码的时候都会用到，但是其长度和详细程序确实显示出了在构建一个站点时有多少因素是必须被考虑到的.
选择正确的工具和库是一项很有挑战性的任务，特别是在每天都有新工具和库被创建出来的时候.
网页美工设计培训老师的策略是收藏一份工具盒资源的列表 来对最好和最有用的东东进行持续跟踪， 那就你就可以在下一个项目中随意的来使用它了.
4. 使用版本控制
版本控制是一种按照时间来记录对文件或者资源的修改，它允许多人编辑，变化跟踪，以及对资源的管理. 有许多支持版本控制的服务，包括Bitbucket, Assembla, 以及 Github. Github 是我个人的最爱，因为它支持社交化编码，这意味着人们可以在Github上分享代码，发展或者学习别人写的代码.
版本控制是一个理解起来有点复杂的话题，但却有很多入门教程。我建议在着手前看下我们对git的介绍以对其有一个基本的了解。也可以看下我们的团队中git使用指南和git进阶窍门。如果你对git没兴趣，你也可以看下版本控制的其他建议。
最后一个建议：使用命令行。命令行是一个令人生畏的用户接口，但熟悉它会在整体上提高你对编程的理解，同时可以让你有能力使用其他优秀的工具，例如Gulp和Grunt。
5.开始代码审查
如果你是一个团队中的一员那这对你来说很简单，但如果你是独立开发者代码审查也不是不可能的。代码审查的基本思想是将你写的代码展示给其他开发者（或上级），这样你就可以解释你写了什么，从而知道如何能写得更好，甚至可以教导对你所使用的技术不熟悉的人。
最好每周进行一次，同时本着学习如何改进已完成代码的目的进行。
如果你是独立开发，或者你很反社会，jslint 和 SCSSlint 会是很有用的。这些工具在保持你的文件整洁干净的同时会检查你的代码是否有错误。有了它们你也就不需要与人接触了。
6. 接受编程的挑战
有许多免费的在线资源旨在为想要寻找到对其每天使用的语言更好理解的开发者提供编程挑战. 大多数的这些站点都配备有大型的社区，愿意在需要时提供帮助，因此你不必担心遇到困难后无法继续下去.
CodeWars 对梳理你的Js能力很有帮助，还有 Practice App 为你提供在 Codepen 构建的随机的前端挑战.
上海非凡进修学院
网页美工设计培训老师友情提示：多少按照上面的建议那样做，都将大大提升你的编码技能，并因此提升你所编写的站点，工具或者应用的质量.
本文来源：网络。整理：
网页美工设计培训学校。更多资讯【请关注微信号：feifanxueyuan】(版权声明：推送文章和图片我们都会注明作者和来源，除非确实无法确认。部分文章和图片推送时未能与原作者取得联系，若涉及版权，烦请原作者联系小编更正，谢谢。)
源自名校
学院资质
专注19年
400-616-2336
老师①
返回顶部