概念
模块
1、理解:向外提供特定功能的JS程序,一般就是一个js文件
2、为什么要拆成模块:随着业务逻辑增加,代码越来越多且复杂,增加其复用性
3、作用:复用js,简化js的编写,提高js运行效率
组件
1、理解:用来实现局部功能效果的代码和资源的集合,可以通俗理解为代码块(html、css、js、img)集合
2、为什么:一个界面的功能太过于复杂,且多个页面进行基本相同的功能复用
3、作用:复用编码,简化项目编码结构,提高运行效率
React中组件定义的两种方式(Vue请结合Vue文档进行定义)
1、工厂函数组件
function MyComponent() {
return <h2>return 出来的必须是一个虚拟DOM</h2>
}
2、ES6类组件(一种复杂组件:有状态的组件)
class MyComponent2 extends React.Component {
render () {
return <h2>使用ES6类组件方式</h2>
}
}
React渲染组件的标签
ReactDOM.render(<MyComponent />,document.getElementById('test'));//MyComponent内部包含了<h2>标签
模块化
当应用的js都以模块化来编写的,这个应用就是一个模块化的应用
组件化
当应用是以多组件的方式实现,这个应用就是一个组件化的应用