模块与组件,模块化与组件化的理解
模块
理解:向外提供特殊功能的JS程序,一般就是一个js文件;
为什么要拆成模块:随着业务逻辑的增多,代码越来越多且复杂;
作用:复用js,简化js的编写,提高js运行效率。
组件
理解:用来实现局部功能效果的代码和资源的集合;
为什么:一个界面的功能更复杂;
作用:复用代码,简化项目编码,提高运行效率;
模块化
当应用的js都已模块来编写的,这个应用就是一个模块化的应用
组件化
当应用是以多组件的方式实现,这个应用就是一个组件化的应用
定义函数式组件和类式组件
函数式组件
函数定义的组件
执行了ReactDOM.render(Mycomponent />, document.getElementById('test'))之后,发生了什
么?
1.react解析组件标签,找到了Mycomponent函数组件,如果找不到,则报错
2.发现组件是使用函数定义的,随后调用该函数,将返回的虚拟dom转为真实dom,随后呈现在页
面中
定义类组件
定义类式组件,要求自己的类必须继承react中的类(React.component),该类是react内置的
创建类组件必须要满足的三点:
1.必须继承react当中的类(React.component)
2.必须写render() {}
3.render函数中必须写返回值
类式组件
执行了ReactDOM.render(Mycomponent />, document.getElementById('test'))之后,发生了什
么?
1.react解析组件标签,找到了myComponent函数组件,如果找不到,则报错
2.发现组件是使用类定义的,随后new出来该类实的例,并通过该实调例用到原型上的render方法
3.将render返回的虚拟dom转为真实dom,随后呈现在页面中
复习类的基础知识
类的定义及使用
类的基本知识
类的继承
继承
总结:
1.类中的构造器不是必须写的,要对实例进行一些初始化的操作,如添加指定属性时才写
2.如果A类继承了B类,且A类中写了构造器,那么A类构造器中的super是必须要调用的,且要写在
新 增属性的 最前面
3.类中所定义的方法,都是放在了类的原型对象上,供实例去使用