字节跳动商业化面试面经

说明

这篇字节跳动商业化的面经同样来自一朋友的总结,先介绍下他的背景,目前有6年的前端开发经验,base北京.本次的字节跳动面经总结只发记录的面试题,不加自我的分析和答案了.有些问题属于项目经验相关的面试题,可能仁者见仁,没有标准答案还需要根据自身情况做准备.还有一些技术性的问题,在小程序前端面试题宝典(点我)都能找到详细的答案解析就不一一列举了.

希望这篇面经能对大家面试过程有一定的帮助.以下是正题:

一面

1. 项目：可视化搭建平台中的细节问题：数据规范，请求收敛

2. 组件的拖拽行为是怎么实现的，如何为组件注入行为。

3. 性能优化的指标？用了哪些手段

4. 如何做到页面一部分资源返回，其他资源延迟返回

5. 页面的缓存问题，相关的请求头字段和响应头字段

6. 描述一下https，加密过程，证书问题

7. webpack的打包原理，在webpack之前是如何处理这些问题的

8. webpack loader和plugin的功能，区别。

9. js的事件机制

10. 异步编程中，如何实现三个请求依次返回

11. H5页面中长列表在下拉过程中为什么会闪一下，如何解决？

主要是重绘和重排问题

12. 查询css属性的时候会触发重排么？

13. vue2.0 的响应式原理，vue3.0 的响应式原理

14. vue3.0 都解决了哪些问题

15. 设计题，如何开发一个select 组件，类似百度输入框功能，需要考虑的点有哪些

算法题

第一道题目是英文的：Given a 2D char array and a String array. Find the path of each word in the String array such that all paths don't share any same ltter located at (i, j)

把题目翻译了一遍：给一个2D char 数组和一个字符串数组，找到所有字符串在2D char 数组中的路径并且每一个路径和另一个路径不重复使用一个位置上的字母。

然后理直气壮的说了一句不会～

然后面试官讲，那咱换一道，于是就有了第二道

给定数组【2，3，4，6，7】，target=7 输出数组中和等于目标的所有组合

思路：

×：当前组合和之前生成的组合重复了。
△：当前求和 > target，不能选下去了，返回。
○：求和正好 == target，加入解集，并返回。

const combinationSum = (candidates, target) => {
  const res = [];
  const dfs = (start, temp, sum) => { // start是当前选择的起点索引 temp是当前的集合 sum是当前求和
    if (sum >= target) {
      if (sum == target) {
        res.push(temp.slice()); // temp的拷贝 加入解集
      }
      return;   // 结束当前递归
    }
    for (let i = start; i < candidates.length; i++) { // 枚举当前可选的数，从start开始
      temp.push(candidates[i]);          // 选这个数
      dfs(i, temp, sum + candidates[i]); // 基于此继续选择，传i，下一次就不会选到i左边的数
      temp.pop();   // 撤销选择，回到选择candidates[i]之前的状态，继续尝试选同层右边的数
    }
  };
  dfs(0, [], 0); // 最开始可选的数是从第0项开始的，传入一个空集合，sum也为0
  return res;

二面

1 项目：

2. 数据结构：二叉树，遍历的方式

3. TCP/IP DNS，CDN的原理：

4. 浏览器渲染原理，详细讲一下页面渲染：

5. 用递归的方式实现list到tree的转换，tree的层次由给定的path决定，注意对父结点与子结点的处理！

var userList = [

{name:'user1',age:18,province:'四川',city:'成都',district:'高新区'},

{name:'user2',age:19,province:'四川',city:'成都',district:'天府新区'},

{name:'user3',age:20,province:'四川',city:'南充',district:'顺庆区'},

{name:'user4',age:22,province:'江苏',city:'南京',district:'鼓楼区'},

{name:'user5',age:21,province:'江苏',city:'南京',district:'玄武区'},

{name:'user6',age:21,province:'江苏',city:'镇江',district:'京口区'}

]

function list2tree(list,path){

// TODO

};

var userTree = list2tree(userList, 'province/city/district');

6. 如何开发一个tree组件，思路，注意的点

7. 最近有关注哪些新技术

最后

三面？没有三面。因为要去成都，三面直接放弃了，HR联系了好几次，还是很硬气的放弃了，hh

字节的面试整体来讲比较注重基础和设计，一、二面都有组件设计相关，主要想考察平时对项目的思考和实践，以及前瞻性吧。

算法一面第一道敢于理直气壮的放弃是因为之前看到过，leetcode上属于困难～。其他的问题都比较常规，基础。这类题回答的时候，对于自己比较熟悉的，就讲的详细一些，用自己的话在准备面试前梳理一下，比如问到https，可以顺便提一下http，然后从为什么会有https，https解决了什么问题，流程，手段。。。

字节的面试官还是比较nice的，一面面试官是个戴眼镜的妹仔，还简单的捧了下，小姐姐看上去是校招生～，“哈哈哈，我工作6年了...”。。。

二面面试官从视频口出现的那一刻，就断定了这是一位技术大佬，对没错，我就是通过发型判断出来的。二面的时候，有卡壳的地方，面试官会很温和的讲，没关系，这个你平时可能遇到的比较少，项目中没用到，下去可以再看一下～听起来就是从百度过去的。聊到新技术，说了一下微前端（也不算什么新技术），聊了下会使用到的场景，这些面试问题一般都是考察自驱力和学习状态。整个面试流程很快，第一天一面，第二天约二面，有时间的话，一天都能走完整个面试流程。反馈会比较及时，面完了，就不用纠结面试结果了。

切记一点，这样的面试不会的就说不会，别发散，说些没用的

面试之前一定要多刷题,把那些比较常规的面试题好好准备,剩下的靠自己的临场发挥.如果大家想找一些全面系统的前端面试题,再次安利我们团队开发的xiao^chgengxu前端面试题宝典去刷题 ,600多道前端面试题包罗万象,可以助你一臂之力.避免广告之嫌就不多说了哈~