0
点赞
收藏
分享

微信扫一扫

模块化和组件化的理解

求索大伟 2022-03-15 阅读 64
前端vue.js

在这里插入图片描述

一、什么是组件和模块

1.1组件:把重复的代码提取出来合并成为一个个组件,组件最重要的就是重用(复用),位于框架最底层,其他功能都依赖于组件,可供不同功能使用,独立性强。
1.2模块:分属同一功能/业务的代码进行隔离(分装)成独立的模块,可以独立运行,以页面、功能或其他不同粒度划分程度不同的模块,位于业务框架层,模块间通过接口调用,目的是降低模块间的耦合,由之前的主应用与模块耦合,变为主应用与接口耦合,接口与模块耦合。
模块就像有多个USB插口的充电宝,可以和多部手机充电,接口可以随意插拔。复用性很强,可以独立管理。

二、组件和模块的区别

2.1组件:就像一个个小的单位,多个组件可以组合成组件库,方便调用和复用,组件间也可以嵌套,小组件组合成大组件。
2.2模块:就像是独立的功能和项目(如淘宝:注册、登录、购物、直播…),可以调用组件来组成模块,多个模块可以组合成业务框架。

三、为什么要使用组件化和模块化?

3.1开发和调试效率高:随着功能越来越多,代码结构会越发复杂,要修改某一个小功能,可能要重新翻阅整个项目的代码,把所有相同的地方都修改一遍,重复劳动浪费时间和人力,效率低;使用组件化,每个相同的功能结构都调用同一个组件,只需要修改这个组件,即可全局修改。
3.2可维护性强:便于后期代码查找和维护。
3.3避免阻断:模块化是可以独立运行的,如果一个模块产生了bug,不会影响其他模块的调用。
3.4版本管理更容易:如果由多人协作开发,可以避免代码覆盖和冲突。

下面来总结一下本文内容:

组件:把重复的代码提取出来合并成为一个个组件,组件最重要的就是重用(复用)
模块:分属同一功能/业务的代码进行隔离(分装)成独立的模块,可以独立运行,独立管理,每个模块有很多接口,可供调用
组件化模块化优点:开发调试效率高、可维护性强、避免阻断、版本管理更容易

举报

相关推荐

0 条评论