持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第3天，点击查看活动详情

一、模块、组件

模块

1、模块简单来说就是向外提供特定功能的js程序, 一般就是一个js文件

2、为什么要拆成模块：随着业务逻辑增加，代码越来越多且复杂。

3、作用：复用js, 简化js的编写, 提高js运行效率

4、模块化：当应用的js都以模块来编写的, 这个应用就是一个模块化的应用

组件

1、组件是用来实现局部功能效果的代码和资源的集合(html/css/js/image等等)

2、为什么要用组件： 一个界面的功能更复杂

3、作用：复用编码, 简化项目编码, 提高运行效率

4、组件化：当应用是以多组件的方式实现, 这个应用就是一个组件化的应用

二、React Developer Tools

在说react组件化前，我们先来安装下React 开发者调试工具

常用浏览器，打开扩展，搜索react，记住要安装 Facebook的出品的。

下载安装扩展后，可以看见控制台多了两个选项，Components 和 Profiler

只要浏览器控制台能看见这个了标签页，就说明安装调试工具成功了

三、react两种组件

1、函数式组件

2、类式组件