寒冬中的前端社招面试

35,466 阅读9分钟

前言

本人17年毕业至今,一年多工作经验,三月中旬加入了找工作的大潮。这里整理了一下最近面试的题目,分享给大家。

再惠

一面

  1. 自我介绍一下
  2. 看到你用过mobx,说一下mobx的优势?实现原理呢?
  3. 你工作以来,在项目中遇到的印象深刻的问题有哪些?有没有在项目实践过一些自己的想法和新技术?
  4. 说说TS和ES的区别,以及TS带来的好处?
  5. 你说你学习能力强,那你毕业这一年多来,你都是怎么熟悉业务和项目的?有系统的看完过哪本书?
  6. 对小程序有了解吗?(我只写过demo)
  7. 对打包工具有了解吗?
  8. 除了react,你还用过哪些框架?
  9. 求契波那切数列的第N项
  10. 获取到契波那切数列的前N项
  11. 求一个对象的层级数(我写完后,又问如果不用递归,只用循环实现呢)
  12. 实现下面这道题中的machine函数
function machine() {
    
}
machine('robot').execute() 
// start robot
machine('robot').do('eat').execute(); 
// start robot
// robot eat
machine('robot').wait(5).do('eat').execute();
// start robot
// wait 5s(这里等待了5s)
// robot eat
machine('robot').waitFirst(5).do('eat').execute();
// wait 5s
// start robot
// robot eat

二面

  1. 介绍一下你们那边的业务?那你们业务都是在app里面吗?(安卓、IOS、H5甚至小程序和快应用都有,基本上都是webview套h5做的)
  2. 你最近有比较感兴趣的、主要研究的技术吗?为什么感兴趣?
  3. 我看了你的github,上面star了一个react.backbone,这个是什么?
  4. 我看你的github里面有个mobx-jquery,这个是做什么的?
  5. 这个mobx-jquery里面的observer你是怎么实现的?(封装的autorun)那么autorun的原理是什么?
  6. 你对团队的要求是怎么样的?你毕业这一年多收获最大的是什么?
  7. 看到你写了TS,那么TS的优势是什么呢?你说修改字段后其他还用原字段的地方会报错,那么是怎么跟踪到是否修改的呢?vscode里面是怎么实现根据类型文件来给一个方法添加类型的呢?
  8. 看到你的简历里面写着维护一个老项目,这个lizard是什么框架?(基于backbone封装的一个Hybrid框架xxxxx)
  9. 那来做道题吧。实现一个函数,可以按顺序获取到一个DOM节点下面所有的文本。
  10. 你有什么想问我的吗?(你平时在公司的一天都是在做什么呢?)

总结

感觉技术栈和这家可能不是很匹配,他们主要做h5和小程序,h5也以vue居多,所以这些问题基本上都没怎么深入。

面试除了mobx,也没问过我react相关的技术,也没问过app开发方面的东西,他们唯一感兴趣的就是TS,可惜我TS写的不多。

但是面试体验还不错,我属于比较紧张的人。面试官让现场写代码,可以查资料,可以现场调试,甚至有不懂的还可以问一下他,我觉得这个挺好的。听他们描述,感觉团队技术氛围不错,和HR聊了一下,觉得福利还算不错。

附上一面第12题的答案。

function machine(name) {
    return new Action(name)
}
const defer = (time, callback) => {
    return new Promise((resolve) => {
        setTimeout(() => {
            resolve(callback())
        }, time * 1000)
    })
}
class QueueItem {
    constructor(defer, callback) {
        this.defer = defer;
        this.callback = callback;
    }
}
class Action {
    queue = []
    constructor(name) {
        this.name = name;
        this.queue.push(new QueueItem(0, () => console.log(`start ${this.name}`)))
    }
    do(eat) {
        this.queue.push(new QueueItem(0, () => console.log(`${this.name} ${eat}`)))
        return this;
    }
    wait(time) {
        this.queue.push(new QueueItem(time, () => console.log(`wait ${time}s`)))
        return this;
    }
    waitFirst(time) {
        this.queue.unshift(new QueueItem(time, () => console.log(`wait ${time}s`)))
        return this;
    }
    async execute() {
        while(this.queue.length > 0) {
            const curItem = this.queue.shift();
            if (!curItem.defer) {
                curItem.callback();
                continue;
            }
            await defer(curItem.defer, curItem.callback)
        }
    }
}

富途

一面(记不清了)

  1. 自我介绍
  2. 为什么离职?你说你觉得做的业务无聊,那怎么样才是不无聊的呢?你期望的团队是怎样的?
  3. 什么是xss攻击?有什么危害?怎么解决?
  4. 实现一个深拷贝
  5. 有两个有序数组M和N,怎么判断N是否为M的子集?
  6. 箭头函数和普通函数有什么区别?
  7. for循环里面setTimeout打印的值是多少?怎么解决这个问题呢?(let和闭包解决,解释一下原理就好了)
  8. 你们团队中的每个成员都是什么角色?你在里面扮演什么角色?
  9. 怎么优化页面的加载速度?如果有很多个小图标,怎么优化?iconfont有什么缺点?
  10. 移动端兼容不同设备有哪些解决方案?这些方案都有哪些缺点?

达达-京东到家

面试过去的时候,先让做了一张试卷,主要是考察http、css和js的。

笔试题(只记得这几道http相关的)

  1. http2.0的新特性有哪些?(选项是多路复用、头部压缩、设置优先级、服务端推送、二进制传输)
  2. DNS的作用有哪些?(选项是域名解析、防火墙、负载均衡、控制流量还有一个我不记得了)
  3. 以下哪些协议是可靠的?(选项是TCP、UDP、FTP、HTTP还有一个我不记得了)
  4. 以下关于POST请求说法正确的是?(POST请求只能通过body带参数、服务器一定能够收到POST请求发送的数据、POST请求发送了两个数据包、POST请求可以被缓存)

一面

  1. 什么是BFC?垂直margin重叠是为什么?怎么解决这个问题?
  2. CSS里面有哪些相对单位?都是相对什么的?
  3. fixed是相对于谁定位的?如果加上transform会出现问题吗?
  4. 什么是XSS攻击?怎么解决?
  5. innerHTML有什么问题?有什么简单的办法可以避免插入文本被XSS攻击吗?
  6. 为什么不推荐用style内联元素?内联元素有什么缺点?(css文件可以缓存)
  7. 什么是原型链?原型链的终点指向什么?
  8. cookie、sessionStorage、localStorage的区别和作用是?
  9. http状态码有哪些?301和302的区别是什么?304是指什么?
  10. 什么是闭包?使用场景有哪些?闭包会引起什么问题?
  11. 什么是浅拷贝和深拷贝?怎么实现一个深拷贝?
  12. lodash和ramda的区别是什么?
  13. HTML中attribute和property的区别是什么?
  14. 怎么解决跨域?
  15. 字符串和new String出来的字符串有啥区别?

二面

  1. 解释一下react中setState?(说说setState的表现和原理实现)
  2. 如果我需要上传一个文件,前端展示进度条,用setState会导致合并更新,你有什么好办法?(Promise封装setState、利用setState底层特性,使用异步函数(setTimeout、async)包裹)
  3. 有状态组件和无状态组件,有人说有状态的更好复用,有人说无状态的更好复用,你平时写的时候是怎么分的?(这个还是要看业务场景)
  4. 如果有个react项目,你该管理组件状态?(从local state、global state和global store三个方向来解释)
  5. react中组件是怎么响应数据的变化从而更新的呢?
  6. react中的生命周期分为哪几个阶段?react16废弃了哪几个生命周期api?
  7. 虚拟DOM相比真实DOM,为什么会带来性能上的优化?
  8. diff算法是怎么比较新旧节点并更新的?key有什么作用?
  9. 如果我这里有一个文本组件,我修改了里面的文本,那么会影响到其他的组件吗?(所以这个还是要看场景)
  10. 如果store中有一个cityList字段,我们需要在用户刷新后保持原来的样子,做缓存,如果这个时候上方下达了一个命令,需要关闭某个城市的物流配送,这个时候需要将该城市移除,用户不刷新浏览器的情况下,如何做到?(这道题说实话我没理解,我说更新store和缓存,但被面试官否定了,后来只能说不知道,也忘了问他答案是什么了)
  11. 对webpack有了解吗?chunk、bundle和module有什么区别?
  12. 说说hash、chunkhash和contenthash的区别?
  13. TypeScript有哪些好处?
  14. 浏览器页面渲染的流程是什么?
  15. css会阻塞页面渲染吗?会的话该怎么解决呢?怎么做到只加载首页的css?
  16. 你觉得你最擅长的技术是哪一块呢?

综合面(综合+HR+部门leader)

  1. 从你的项目中随便找一个,说一说这个项目解决了哪方面的问题,业务或者技术上的都行。
  2. 这个项目中你的角色是什么?你做了哪些?哪里又能够体现你的能力呢?
  3. 为什么只在携程呆了一年多就出来找工作了?你现在的职级是多少?
  4. 你最近有看过什么书?最近在研究的技术是什么?
  5. 用过vue吗?感觉和react的区别是什么?如果让你做vue项目,你能接受吗?
  6. 这边是一个vue重构到react的项目,最近招人来做这块的内容,包括webpack之类的都是重新搭,你觉得你能hold住吗?
  7. 打算在上海定居吗?是打算啥时候回二线?
  8. 你未来3-5年的职业规划是什么?
  9. 其他私密问题等等

总结

二面的时候,面试官问我有什么想问的吗?我说,对于我这种刚毕业1-2年的人来说,我对webpack和node接触比较少,在公司也很难接触到,自己写项目又遇不到很多深入的场景,接下来我该往哪方面发展呢?什么才是更重要的呢?

面试官说,你之前说自己为什么离职的时候已经说的很清楚了,我相信你已经找到答案了。我觉得对于毕业1-3年的人来说,如果能够做到独立去带一个项目和团队,这是非常可贵的。

部门leader面的时候,问了我很多项目方面的问题,不少正中我要害,刚毕业一年多来确实没有想过那么多东西。在技术不够突出,工作经验也比较少的情况下,似乎也很难说哪里能够体现出自己的能力。如果能多呆半年,肯定会有不一样的回答。

HR面的时候,这个HR对前东家的薪资待遇、职称等等可以说非常了解了,问了很多深入和细节的问题,也和我聊了很多,导致我非常尴尬和紧张(我一向不会撒谎,很多都是照实说了)。

这是自己遇到时间最久一次面试,算上HR面前后有五轮。不过,还算是愉快,至少让我积累了一大笔很宝贵的面试经验。