快手校招一面

2023-04-19 14:00

组件库
事件循环
事件委托
call apply 的区别
react 合成事件
- 在 React 中，合成事件是一种对原生事件的跨浏览器封装。
- React 合成事件系统的目的是提供一种一致的 API 来处理浏览器的原生事件。它们是由 React 构建的，而不是由浏览器原生事件 API 生成的。
- React 合成事件提供了一些优点，例如：
  - 跨浏览器兼容性：React 合成事件在各种浏览器上都表现一致，解决了浏览器兼容性问题。
  - 性能优化：React 合成事件使用事件委托技术，将事件处理程序绑定到父元素而不是每个子元素，从而减少内存占用并提高性能。
  - 事件池：React 合成事件使用事件池来优化内存使用，避免在每个事件处理程序执行时创建新的事件对象。
- 通过使用 React 合成事件，React 能够提供更高效的事件处理机制，同时保证代码的可读性和可维护性。
react 生命周期
react18
react 批处理
- vue 没有批处理如何做的？

做题

css 三角形
快排

function quickSort(arr) {
  if (arr.length <= 1) {
    return arr
  }

  // 选择基准元素
  const pivotIndex = Math.floor(arr.length / 2)
  const pivot = arr[pivotIndex]

  // 分成两个子数组
  const left = []
  const right = []
  for (let i = 0; i < arr.length; i++) {
    if (i !== pivotIndex) {
      if (arr[i] < pivot) {
        left.push(arr[i])
      } else {
        right.push(arr[i])
      }
    }
  }

  // 递归排序子数组
  return [...quickSort(left), pivot, ...quickSort(right)]
}

实现防抖节流
实现发布订阅
- on
- emit

// 定义一个全局的事件总线
const eventBus = {
  events: {},
  on(event, callback) {
    if (!this.events[event]) {
      this.events[event] = []
    }
    this.events[event].push(callback)
  },
  emit(event, data) {
    const callbacks = this.events[event] || []
    callbacks.forEach(callback => {
      callback(data)
    })
  }
}

// 在组件中订阅事件
eventBus.on('eventName', data => {
  console.log(`Received data: ${data}`);
});

// 在组件中发布事件
eventBus.emit('eventName', { message: 'Hello World' });

快手 校招 一面 ​

快手校招一面