8、说说你对fiber架构的理解?解决了什么问题?
fiber架构是一种基于用户模式线程的并发线程模型。通过在应用程序内部创建轻量级的执行单元来实现并发问题。解决了传统多线程的性能开销和复杂性问题。
14、说说你对@reduxjs/toolkit的理解?和react-redux有什么区别?
@reduxjs/toolkit是一个官方推荐的简化redux开发工具。提供了一组简化redux使用的API,包括创建reduxstore定义reducer和action等
区别在于@reduxjs/toolkit组要时简化开发流程,提供了更简洁的API,帮助开发者快速的编写。
Redux时用于在react中使用的库,提供了一些API帮组我们链接redux store和react组件
15、React render方法的原理,在什么时候会触发?
React中render方法适用于将组件渲染到DOM中的方法。原理时通过虚拟DOM的diff算法来计算出需要更新的部分,并将这些部分更新实际DOM中。
17、如何通过原生js实现一个节流函数和防抖函数,写出核心代码,不是简单的思路?
当你需要在高频率触发的事件中限制函数的执行次数时,你可以使用节流函数。而当你需要在事件连续触发时将函数的执行合并为一次,你可以使用防抖函数。下面是通过原生JavaScript实现节流函数和防抖函数的核心代码:
1. 节流函数(Throttle):
function throttle(func, delay) {
let prev = 0;
return function() {
const now = Date.now();
if (now - prev >= delay) {
func.apply(this, arguments);
prev = now;
}
}
}
2. 防抖函数(Debounce):
function debounce(func, delay) {
let timeoutId;
return function() {
clearTimeout(timeoutId);
timeoutId = setTimeout(() => {
func.apply(this, arguments);
}, delay);
}
}
在这两个函数中,`func`表示要执行的函数,`delay`表示时间间隔。`throttle`函数会根据指定的时间间隔来限制函数的执行次数,而`debounce`函数会在指定的时间间隔内连续触发的事件中将函数的执行合并为一次。
使用示例:
function onScroll() {
console.log('Scroll event');
}
const throttledScroll = throttle(onScroll, 200);
const debouncedScroll = debounce(onScroll, 200);
window.addEventListener('scroll', throttledScroll);
window.addEventListener('scroll', debouncedScroll);
在上面的示例中,`onScroll`函数会被节流函数和防抖函数限制执行。`throttledScroll`会在每200毫秒内最多执行一次,而`debouncedScroll`会在最后一次触发后的200毫秒内执行一次。你可以根据你的需求选择适合的方式来限制函数的执行次数。