super() 和 super(props) 有什么区别?
子类没有自己的this,需要使用继承父类的this,来初始化属性,调用super(props) 实际上就是调用super.prototype.call(this, props)
React 事件机制
<div onClick={this.handleClick.bind(this)}>点我</div>
React并不是将click事件绑定到了div的真实DOM上,而是在根dom容器处监听了所有的事件,当事件发生并且冒泡到根dom容器处的时候,React将事件内容封装并交由真正的处理函数运行。这样的方式不仅仅减少了内存的消耗,还能在组件挂在销毁时统一订阅和移除事件。
除此之外,冒泡到根dom容器上的事件也不是原生的浏览器事件,而是由react自己实现的合成事件(SyntheticEvent)。因此如果不想要是事件冒泡的话应该调用event.preventDefault()方法,而不是调用event.stopProppagation()方法。
p3-juejin.byteimg.com/tos-cn-i-k3…
实现合成事件的目的如下:
- 合成事件首先抹平了浏览器之间的兼容问题,另外这是一个跨浏览器原生事件包装器,赋予了跨浏览器开发的能力;
- 对于原生浏览器事件来说,浏览器会给监听器创建一个事件对象。如果你有很多的事件监听,那么就需要分配很多的事件对象,造成高额的内存分配问题。但是对于合成事件来说,有一个事件池专门来管理它们的创建和销毁,当事件需要被使用时,就会从池子中复用对象,事件回调结束后,就会销毁事件对象上的属性,从而便于下次复用事件对象。
React 组件中怎么做事件代理?它的原理是什么?
React基于Virtual DOM实现了一个SyntheticEvent层(合成事件层),定义的事件处理器会接收到一个合成事件对象的实例
在React底层,主要对合成事件做了两件事:
- 事件委派: React会把所有的事件绑定到结构的最外层,使用统一的事件监听器,这个事件监听器上维持了一个映射来保存所有组件内部事件监听和处理函数。
- 自动绑定: React组件中,每个方法的上下文都会指向该组件的实例,即自动绑定this为当前组件
React key的作用
key作为元素的唯一标识符,用来识别哪些元素更新和删除 在diff算法用来比较新的虚拟dom 和 current fiber节点,如果newchild是单个元素(object),先对比key再对比elementType,如果key不同则删除旧的fiber,如果key相同而elementtype不同则删除整个旧的节点包括其sibling,对于多个节点,newchild是array,例如 ABCD 更新后未ACDB,则此时只要将D节点移动到A后面,其他不要动,
如果没有加key则需要更新所有节点,性能开销大
说说对 Node 中的 Buffer 的理解?应用场景?
等待区就是缓存区
说说对 Node 中的 Stream 的理解?应用场景?
- 为什么需要Stream? —— 对于大的文件读取非常好内存,甚至内存溢出,使用stream可以一边读取一边处理
- 什么是stream? ——— 逐快读取处理的一种信息交流方式
- 什么时候用stream? IO操作 网络和读取文件
- 怎么用stream?
const server = http.createServer(function (req, res) {
const method = req.method; // 获取请求方法
if (method === 'GET') { // get 请求
const fileName = path.resolve(__dirname, 'data.txt');
let stream = fs.createReadStream(fileName);
stream.pipe(res); // 将 res 作为 stream 的 dest
}
});
server.listen(8000);
说说对Nodejs中的事件循环机制理解
- 为什么是事件循环 nodejs单线程,非阻塞io编程模型,所以通过循环机制来实现异步任务