记一次字节面试

去年面了一次字节, 答得比较菜, 挂了; 前两天接到了字节 hr 的电话, 问我的情况, 我说我刚入职了某个厂子, 他说没关系, 也可以试试嘛, 我想也对, 就接受了视频面试。

面试自我介绍不必说, 面试官问我, 你这刚入职怎么就想跳槽呢? 我可能太耿直了, 说其实是你们 hr 联系我的...

然后面试官给我的感觉就是, 整个面试过程特别急切, 当然我也比较菜, 一问三不知...

我说我 typescript 和 react 和 webpack 比较熟悉, 所以问题如下:

1. typescript 中 string 和 String 的区别

   • 答: 一个是 ts 的类型, 一个是 js 原生构造类型

2. react hooks vs class, 为什么官方推荐用 hooks

   • 答: 不知道, 没怎么用过 class(我用 react 的时候已经不推荐用 class 了, 所以基本没用过 class), 猜是方便组织代码, 用了 useEffect 举例, 因为 hooks 可以将逻辑放在一起方便管理

3. 浏览器缓存

   • 答: 自我感觉答得还行吧, 前两天刚看的, 就是强制缓存、协商缓存这些(问我协商缓存如果服务器内容改变了返回什么, 我说忘了 302 还是 304 了, 他就说, 再确定一下; 我说需要用了临时去查嘛; 感觉有点莫名其妙...)

4. 介绍 https

   • 答: 不熟悉...

5. react 事件代理

   • 答: 我猜是在问 react 将事件委托到 document 还是 body 上, 然后问我为什么这么做, 我就说应该是出于性能的考虑, 因为事件绑定和解绑比较消耗性能, 所以由 react 监听 document 然后统一分配事件处理

6. 15 分钟实现一个 EventEmit

   • 代码在最下面, 稍微有点问题, 由于需要实现 once, 使用 isOnce 和 disabled 屏蔽掉 once 的事件监听。 而 listeners 移除时机不好确定, 不能在循环中移除监听, 所以反正写的就是下面这样, 面试官指出来了, 我也承认有这些问题, 并说可以在特定的时机移除掉 disabled 的监听

整个面试过程持续 41 分钟, 挂断后 5 分钟告诉我挂了... 总的来说, 个人比较菜, 算一次不怎么愉快的面试吧.

interface Handler {
  name: string;
  callback: Function;
  /**
   * 默认 false
   */
  isOnce?: boolean;
  /**
   * 默认 false
   */
  disabled?: boolean;
}

class Event {
  listeners: Handler[] = []
  
  on(name, callback) {
    this.listeners.push({
      name,
      callback,
    })
    return this
  }
  
  off(name, callback) {
    if (callback) {
      this.listeners = this.listeners.filter((item) => (
        (item.name !== name)
        || (item.callback !== callback)
       ))
      return this
    }
    this.listeners = this.listeners.filter((item) => (item.name !== name))
  }
  
  once(name, callback) {
    this.listeners.push({
      name,
      callback,
      isOnce: true,
    })
    return this
  }
  
  emit(name, value) {
    const listeners = this.listeners.filter((item) => (item.name === name) && (!item.disabled))
    for (let i = 0, len = listeners.length; i < len; i += 1) {
      const listener = listeners[i]
      listener.callback(value)
      if (listener.isOnce) {
        listener.disabled = true
      }
    }
  }
}