Skip to content

Q1

  • useState和useEffect模拟useCallback

Q2

手写订阅发布

javascript
class EventListener{
    constructor(){
        this.D={}
    }
    on(k, f){
        if(!(k in this.D)){
            this.D[k]=[]
        }
        this.D[k].push(f)
    }
    emit(k, ...payload){
        if(this.D[k]){
            this.D[k].forEach(f=>{
                f.apply(this, payload)
            })
        }
    }
}

let print=console.log.bind(console)

let e1=new EventListener()
e1.on('keyup', (data)=>{
    print('hello', data)
})
e1.on('keyup', (data)=>{
    print('hi', data)
})

e1.emit('keyup', 'luca')

Q3 react

  • useMemo好处,坏处
    • 优点

      • 性能优化:
        • useMemo 可以避免在每次渲染时都进行昂贵的计算,仅在依赖项变化时重新计算。这在复杂计算或频繁渲染的组件中尤为重要。
      • 减少不必要的渲染:
        • 当计算结果被传递给子组件时,如果结果没有变化,子组件可以避免不必要的重新渲染,从而提高性能。
      • 简化代码逻辑:
        • useMemo 使代码更具可读性,通过明确地表达哪些计算需要缓存,开发者可以更容易理解代码的意图。
    • 缺点

      • 过度使用:
        • 如果滥用 useMemo,在简单或不频繁更新的组件中使用,可能会导致代码变得复杂且难以维护,同时带来的性能提升微乎其微。
      • 内存开销:
        • useMemo 会占用额外的内存来保存缓存的值,如果依赖项变化频繁,缓存的计算结果也会频繁更新,可能带来额外的内存开销。
      • 依赖项管理:
        • 开发者需要小心地管理依赖项列表,如果遗漏或错误设置依赖项,可能会导致计算结果不正确或不必要的重新计算。
    • 什么时候使用 useMemo

      • 当计算过程耗时且在多次渲染中可能重复时。
      • 当计算结果被传递给子组件,并且这些子组件依赖于结果进行渲染时。
      • 当你明确知道组件的渲染频率和计算的复杂度需要优化时。
  • fiber 优势, 用户打断怎么做的

Q4 网络

客户端和服务端流量控制,当三次重复ACK,发送方和接收方滑动窗口如何变化