2020-09-27 18:58 已编辑腾讯_PCG_前端开发工程师

关注

菜鸡秋招前端面经，海投记录

（2020.9.16更新）

前端菜鸡，站在菜鸡的角度记录一下自己的秋招。

1. 投递记录：

投了将近110吧，后面估计会更多，笔试面试还应付的过来（简历过的少。。😥），冲突比较少，这个整理起来有点费劲。。。后面有空再搞个表格？？牛客表格怎么用呀。。还是先发一些面经吧

2.个人心得：

多投多面。面完一定要复盘。我基本什么公司都面，遇到很多非常nice的面试官，给我指出来很多问题，有些面试官还会给一些建议，甚至有个面试基本是面试官自问自答！！！而且，真的被问到很多重复的问题！！！面完一定要复盘做好记录！！！最后感谢所有的面试官

3.面经：

面试的时候都会记录下来没答上来的问题，或者对自己来说难度较大的问题，面试完会复盘，记录下问题，和一些面经上不常见的问题。但是。。。海投导致现在有一些问题还没能复盘完。。。以下有一些问题我在后面会带上？，如果有大佬会，求帮忙解答一下，感激不尽。

（注：只记下如下三种：1.自己不会的，2.面经不常见的，3.开放性问题）

shein

一面凉

组件优点和缺点
闭包能干什么？实际运用场景
服务器反向代理，前端该做些什么

58

2面

前端性能优化

vipkid

1面

进程与线程区别
进程通信
osi7层
tsl/ssl在哪一层？（表示层，加密，压缩解压都在表示层）

主要问计算机基础

2面

打开url，发生了什么？

打不开，或者请求失败，怎么排查？

携程

问题：

1.异步组件应该是用户行为预判，你做的叫分包加载

2.redux的缺点

3.jsonp就只是把script暴力的插入dom中吗？性能考虑过吗？动态修改script标签的src会不会加载并执行该脚本？建议去看一下jquery的jsonp实现。

4.子组件如何阻止自己渲染？函数组件如何阻止自己渲染？（可以在return中处理？？？）

5.正方形（答padding，10分得2分。有个社招的大佬，想出了inline元素给一个正方形字体？？？）

6.viewlist，list动态加载，不可以直接拼接，而是要用其他方法，比如多个数组。根据数组下标。

7.null跟undefined的区别。

4399

忘了记录了

欢聚集团

1面。

webpack，热更新原理，怎么配react，配react原理是什么，

你实际项目有点少，前端并不是你擅长的，为什么面前端

。。。

反问：

对应届生更看重什么：实战。

热更新原理：你去查吧。

众安保险

一面凉：

面试官肯定是个大佬！问完问题觉得你答得不对不全会主动给你解释，还会扩展，甚至说到跑题。（没有录音好可惜！！！！）

移动端适配

说了，rem，vw，等等，

面试官：vw会有兼容性问题，华为手机啊，chrome啊，还有横屏切换问题。vh的话，移动端，呼出软键盘，计算的vh会减去软键盘的高度。

你对react hooks有没有理解

我巴拉巴拉巴拉

面试官：其实js有两股力量在推，一个是往面向对象的方向推，就是class，一个是往函数式编程的方向在推，比如hooks，hooks有一种像双向数据绑定的效果，比如useeffect，hook可以看做是向vue学习的双向数据绑定的。当然class，跟hook都有特定的应用场景。有时候class更好用，有时候hooks更好用。。巴拉巴拉巴拉（没有录音好可惜！！！）

除了会用，还对redux了解多少，对其他类似的像mobx了解过吗

我巴拉巴拉

面试官：redux的思路，mobx双向数据绑定。有点忘了。还是看场景，在什么样的场景，用什么传值。

对vue有了解过吗

没有

面试官：小项目用vue快。大项目用react，数据流向清晰。

浏览器的兼容问题说到底是什么造成的？

内核的css引擎跟js引擎对内容的解释不一样。

反问：

学习建议：大犀牛，红宝书。学完后应该能对js有更深的理解。

看重应届生什么：学习能力，获取学习资源的方法。

shopee

一面凉：

script直接插入会执行吗
长连接一直保持不浪费网络资源吗（没答上来。keep-alive也是有时间的。）
redux的原理。是如何实现的。
xss的反射型具体是如何做到的。xss恶意代码获取到cookie之后能干嘛，能做csrf攻击吗
浏览器css选择器为什么是从右往左匹配的。

百度正式批

共三面：

见[async await 和 promise微任务执行顺序问题](https://segmentfault.com/q/1010000016147496)

async function async1() {
  console.log("async1 start");

  await async2();

  console.log("async1 end");
}

async function async2() {
  console.log("async2");
}

console.log("script start");

setTimeout(function () {
  console.log("setTimeout");
}, 0);

async1();

new Promise(function (resolve) {
  console.log("promise1");

  resolve();
}).then(function () {
  console.log("promise2");
});

console.log("script end");


//
script start
async1 start
async2
promise1
script end
async1 end          //???????
promise2
setTimeout

伪元素，伪类区别

右边定宽，左边自适应。

前端优化（没答上来的：可以配合后端做优化，但是怎么做呢？BFF层？？）