字节前端商业化一二三面面经

一直有在牛客学习 算是回馈一下社区~

一面 10.10 16:30~17:30

• 项目+八股

问项目

Formily原理

React学习过程中的疑问

常用的hooks

setTimeout和setInterval倒计时是精确的吗

有什么更好的倒计时的实现方式？

浏览器进程 线程

结合线程讲事件循环

网络进程和异步http线程关系

RN白屏问题？

lynx怎么解决的？

HTTP为什么要基于TCP？

HTTPS加密过程

• 手撕
  让在算法和JS场景题二选一 选了后者

  实现sum函数 使得
  sum(2,3) // 5
  sum(2)(3) // 5

  const initialSum = (x, y) => {
    return x + y;
  }
  const curry = function (fn) {
    return function curried (...args1) {
        if (args1.length >= fn.length) {
            return fn.apply(this, args1);
        } else {
            return function (...args2) {
                return curried.apply(this, [...args1, ...args2]);
            }
        }
    }
  }
  const sum = curry(initialSum);

  刚好前两天复习过 写的比较快 面试官说那把算法也写了 汗

  leetcode 括号生成

  当时有点bug还没de完 面试官说时间不够了 问了一下思路 基本对的 然后就是反问了

二面 10.12 15:00~16:00

• 项目+八股
  问项目
  Formily介绍
  怎么桥接不同的UI组件库？
  useCallback useMemo
  useCallback后的函数 组件会重新分配地址吗？
  useImperativeHandle？
  useLayoutEffect和useEffect区别
  react跨层级通信的方式？
  useContext provider原理？
  Hooks内部结构？
  hooks是怎么知道他是哪个组件的？
  HTTP2.0？
  HTTP3.0？为什么基于UDP？
  进程线程区别？
  TCP和UDP区别？
  设计模式了解哪些？
  MVVM理解

• 手撕
  算法

  leetcode 全排列

  JS场景题

  不用async/await循环 实现promise数组的自动有序执行(不考虑失败

  const solution = (promises) => {
    return new Promise(resolve => {
        let count = 0;
        const res = [];
        const len = promises.length;
  
        const auto = (count) => {
            if (count === len) {
                resolve(res);
            } else {
                Promise.resolve(promises[count]).then(data => {
                    res[count] = data;
                    count++;
                    auto();
                })
            }
        }  
    })
  }

  反问

三面 10.14 11:00-12:00
leader面 没让自我介绍 有点记不清了

• 问项目
  formily有哪些联动手段？
  原理分别是什么？
  formily怎么实现响应式？
  Antd4.0怎么实现的？
  区别在哪里？
  中间闲聊了一段 和我探讨了一些非技术的东西（声乐和耳机
  Object map weakmap set区别
  学的最好的课？（答了计算机网络
  tcp拥塞控制？
  快速重传？
  滑动窗口定义是啥

• 看代码说输出

  const p = new Promise(res => res());
  p.then(() => {
  console.log(1);
  throw new Error('err');
  }, () => {
  console.log(2);
  }).then(() => {
  console.log(3);
  }, () => {
  console.log(4);
  }).then(() => {
  console.log(5);
  }, () => {
  console.log(6);
  })

  还有一道很基础的this指向

• 手撕

  对象扁平化 太紧张了 实现方式也不太好 磕磕绊绊地写完了

  const obj = {
  a: {
    b: {
      c: 2,
      d: 5,
    },
    e: {
      f: 1,
      h: {
        i: 3,
      }
    }
  },
  j: 4,
  }
  const res = {};
  const flatten = (obj, k) => {
  if (typeof obj === 'number') {
    const ky = k.slice(1).join('');
    res[ky] = obj;
    return ;
  }
  
  for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
      flatten(obj[key], [...k, '.', key]);
    }
  }
  }
  flatten(obj, []);
  console.log(res);

  反问

希望能给个offer 今年真难呀