模块化开发详解-优快云博客

本文链接：https://blog.youkuaiyun.com/weixin_45608976/article/details/103266350

模块化

将一个项目按照功能划分，理论上一个功能一个模块，关于高内聚低耦合可以看我会在明天另写一篇博客
js文件按照功能分离，根据需求引入不同的文件中。源于服务器端。
在node.js中，模块就是一个文件，通常js、json文件，包是多个模块的集合，类似文件夹。
在前段开发中，最先出现在node.js中，commne.js中（module.exports和require）随着web应用的模块化，
在浏览器端页是需要进行模块化开发，早期AMD，CMD规范，代表Require.js和sea.js。
在es6中，提出了原生模块呼哈的解决方案，就是export和import但是浏览器并没有完全支持，需要借助一些工具，–babel，实现这个转换的有browserify和webpack。

模块化开发的意义

传统的开发方式需要等待所有脚本资源加载完成。这个问题最大的弊端就是页面要等待，因为资源加载是同步的。你的页面会出现短暂的空白期，引入的脚本越多，时间越长，如果某一脚本加载失败，也可能直接挂掉。

模块化的代码则可以很好的处理这个问题。除了模块化支持的脚本必须加载进来以外，其他脚本都可以异步请求，不需要页面等待，可以加速渲染出页面。requirejs，sea.js等也会做好加载重试和模块缓存的处理，确保所有模块运行良好。

所有资源加载的时间不会因为模块化而加速，但是模块化能加速渲染，这是优势。

2.命名问题。为了避免命名冲突，大众做法是用一个变量作为命名空间做隔离，长期开发过程中没人能记住这个变量是否冲突，它的命名规范是什么，治标不治本。
而模块化的出现消除了这点。一个模块内的命名随自己起，和外界不会冲突，对外的永远是你exports出来的内容。
3.代码重用。其实这点和传统开发并无两样，都是把可复用代码抽取出function（再通用点会抽象出类，也就是构造函数），独立文件。但模块化的好处同样可以规避命名空间的问题，不必设置变量污染到全局。一般模块化都有缓存机制，在二次调用时无需再解析，直接获取到缓存模块内容。
4.管理问题。小公司或个人开发，模块化能让自己思路更为清晰，降低代码耦合，优秀的模块能带来代码质量质的飞跃，标准的模块应该是 “分工明细，职责单一，不牵扯需求逻辑” ，它就应该是个万能的螺丝，不需要可以修改，哪里需要用哪里。而中型企业和大团队则很经常会遇到团队协作开发，除了会用svn/git等工具管理，各种需求有不同的人负责处理。模块化对团队开发会起到协同作用，公共模块除了避免重复造轮子的痛苦外，也避免了逻辑混淆。