2021顺丰前端一面+二面+hr面 最详细面经（已拿offer）

Posted 2021-07-10 不爱码字的程序员-

前言：

博主双非一本毕业，本科期间写过一些项目，主要是写微信小程序，当时是图ios和android双端可用，学习的前端知识也都是在这个领域，实际面试的时候也是这么说的

面试技巧另外开篇再说，先上面试干货吧。面试的题目并不一定有严格的顺序关系，有的是从前一个问题延伸而来，（探究的是一个知识的深度），有的是考察面试者的知识广度、有的纯粹是我想到哪里写到哪里的啦。。不要太在意哈，最近工作有点忙。

                    

顺丰一面 

自我介绍。
position 的值有哪些？分别解释下？
absolute 如何进行定位的？
box-sizing 的值有哪些？区别是什么？
常用的布局有哪些？
\\textit{flex}flex 布局如何改变主轴方向?
如何实现垂直居中？
js 的基本数据类型有哪些？
常用的类型判断方法有哪些？
对比下 typeof 和 instanceof？
ES6 新增的特性？
\\textit{let}let 和 \\textit{const}const 的区别？
普通函数和箭头函数的区别？
代码题1. 统计一个字符串中出现次数最多的字符。

代码题2. js 手写快排实现数组从小到大排序。

const quickSort = (nums) => {
    if (nums.length < 2) {
        return nums;
    } else {
        var left = [];
        var right = [];
        var pivot = Math.floor(nums.length / 2); // Math.floor 向下取整
        var base = nums.splice(pivot, 1)[0];
        for (let i = 0; i < nums.length; i++) {
            if (nums[i] < base) {
                left.push(nums[i]);
            } else {
                right.push(nums[i]);
            }
        }
    }
    return quickSort(left).concat([base], quickSort(right));
}

let res = quickSort([1,34,5,76,8,6,9,7,6,3]);
console.log(res); // [1, 3, 5, 6, 6, 7, 8, 9, 34, 76]
/*
 * 思考：快速排序是稳定的吗？
 * 解答：base 的每次选择，会导致快排是不稳定排序。
 */
继续面试：

操作系统中进程和线程的区别？
了解多线程吗？
浏览器内核由哪些线程实现资源的加载，渲染?
浏览器的事件循环？
js 实现异步编程的方式有哪些？
为什么学习 react？
react 应用 Hooks 为了解决什么问题?
react 的 function 组件如何模拟 class 生命周期组件？
了解过前端的打包构建工具吗？
loader 和 plugin 的区别？
解释下跨域？
如何解决跨域?
你遇到的一个印象深刻的问题，你是怎么定位问题，解决问题的？
你觉得你在工作和技术上的优势有哪些？

顺丰二面

自我介绍。
项目经历中写到了 react，讲一下 react 的生命周期。
如果与后端/服务端进行数据交互，一般放到哪个生命周期（sholdcomponentUpdate）？
为什么放到这个生命周期中？
项目中用到了 React Hooks，用到了哪些 Hooks？
UseEffect 的第一个参数和第二个参数分别是什么含义？
接下来是代码考核：

1. 1 左移 4 位之后的 10 进制数对应的是多少？

2. 一道 js 数组的题目，考察 [...arr] 的用法。

3. 写一个方法，返回 1，2，3，4 表示四种奖品，这四种奖品的概率分别是 5%，15%，25%，55%。

接下来是 CSS 相关问题：

如何实现一个三角形？
如何控制三角形大小？
其他问题

讲下 webpack 的配置？
有用到热更新的功能吗？
loader 和 plugin 分别会处理什么事情？
如果生成一个压缩代码，如何配置？
你是用什么创建的 react 项目？
为什么生产模式生成的代码会被压缩？
有用过 git 吗？
git 如何创建一个新的分支？
git 如何删除一个分支？（git branch -d）
-d 和 -D 的区别是？（-d 删除前检查分支状态，-D 直接删除）
promise 的代码题。
平时学习前端的途径？
项目中微信小程序 app.json 的作用？
了解小程序分包的机制吗？
最后一个问题，页面上有一个 a 标记，点击一次打出 1，再点击一次打出 2，说下实现的思路。（面试官应该想要考察的是原生实现，我用 react 写得）

hr面

前两面感觉发挥的还可以，hr 面比较痛苦，非科班的原因，问题就不列举了因为没有普遍性。

技术栈 react 居多，移动端有小程序，App 端用到 RN Flutter。

最终还是拿到了顺丰的 offer，hr 小姐姐挺漂亮的，一面和二面的面试官也很温柔，总体感觉来讲问得知识点还是比较全且较为深入。

 

最后

博主想说，一个好的心态和一个坚持的心很重要，很多冲着高薪的人想学习前端，但是能学到最后的没有几个，遇到困难就放弃了，这种人到处都是，就是因为有的东西难，所以他的回报才很大，我们评判一个前端开发者是什么水平，就是他解决问题的能力有多强。

分享一些简单的前端面试题以及学习路线给大家，点击这里即可免费领取

觉得博主写的对你有所帮助的话，动动小手给博主一个免费的三连哦