面经-2/小记

• 自己封装组件过程
  • 需求分析
  • 父子传递
    • 数据props
    • 插槽slot
    • defineExpose()
    • defineEmit()
    • 透传attribute
• 代码题

a: (value) => {
      return (value >>> 0) & 0x000000FF
    },

 b: () => {
     return "xxxxxxxxxxxxxxxx".replace(/[xy]/g, function (c) {
         var r = (Math.random() * 16) | 0,
             v = c == "x" ? r : (r & 0x3) | 0x8
         return v.toString(16)
     })
 },

 // id:String
 c: (id) => {
     if (id.length < 0) return
     let a = []
     for (i in id) {
         a.push(id.charCodeAt(i))
     }
     return new Uint8Array(a)
 },

• 返回1w条数据, 前端怎么处理
  • 分页
  • 创建文档片段
  • 延迟加载
• 前端项目优化
• 组件通信
  • 组件关系
    • 父子组件
    • 兄弟组件
    • 后代组件
    • 非关系组件
  • 通信方案
    • props
    • $emit
    • ref
    • EventBus
    • $parent/$root
    • 透传attrs
    • Provide/Inject
    • 状态管理 Vuex/Pinia
• Vue双向绑定
  • MVVM中的ViewPoint层, 分为数据监听和模板解析两大块
  • 数据监听通过数据劫持来实现, 如果数据在Model层发生了变化, 回触发视图的更新
  • 如果View层发生变化, 也会引起监听器的生效
• nextTick
  • 背景: DOM更新是异步操作
  • 定义: nextTick是DOM完成更新后的回调, 优化了大量重复的DOM渲染