记字节跳动Data前端开发实习面试。
一面
因为原来的面试官临时开会,等了一会换了一个面试官,好事多磨啊。面试气氛还是很和谐的,每块内容都有涉及,并且会深入一些。大概有JavaScript基础、算法、计算机网络、设计模式。
-
自我介绍
-
this探讨
-
说说有哪些改变this指向的方法
this是在执行环境决定的,有call、apply、bind的方法,在new对象的时候也会修改this
-
阅读代码说结果
从基础到复杂,题目比较多,大概记得这些
function a() { console.log(this.name); } a();
var name = 1; a();
a.prototype.name = 2; a()
function b() { this.value = this.name; } b();
let c = {name: 3}; c.say = a; let d = c.say; c.say(); d();
-
-
bind实现
-
假如要兼容IE,请简单实现一下bind(上题自己挖的坑)
// 当时写的代码,没考虑参数 Function.prototype.bind = function (obj) { return () => { this.call(obj); } }
-
这里为什么用箭头函数,上面那个function可以换成箭头函数嘛
因为箭头函数本身没有this,绑定外层的this。上面的那个function不能换成箭头函数
-
-
你看过Vue的源码嘛?简单实现一下发布订阅模式
源码浅浅看过😀,但是没全部看懂。
脑子里一下就想起on,emit,off,once,当时写到一半就被叫停了,好不容易遇到easy的。。。
class EventHelper { construct() { this._eventMap = {} } on(fn, cb) { this._eventMap[fn] ? this._eventMap.push(cb) : this._eventMap[fn] = [cb]; } emit(fn, ...args) { if (this._eventMap[fn]) { this._eventMap[fn].forEach((cb) => cb.apply(this, args)) } } off(fn) { if (this._eventMap[fn]) { delete (this._eventMap[fn]) } } once(fn, cb) { this.on(fn, () => { cb(); setTimeout(() => { this.off(fn); }) }) } }
-
UDP & TCP
-
说说两者的区别
-
怎么判断这个包是UDP还是TCP
好狠,一下没想起来。一开始答了TCP三次握手😂,后来冷静想想IP的报文段里好像有这个标识。
-
-
HTTPS
-
说说原理
吧啦吧啦,讲了TLS,非对称加密,对称加密。。。
-
中间人攻击
大概讲了一下过程
-
是不能对数据修改,还是对数据修改后,接受端不认
大概讲了一下数字签名
-
-
浏览器缓存
-
说说都有哪些方法
Cache-control、ETag、Last-modify
-
说说什么时候必须使用ETag
一下子没想出来,就说了什么时候需要使用last-modify(还好面试官放过我了😝)
查了查:last-modified不识别s(秒)单位里的修改,所以如果资源在s(秒)单位里发生了修改,那last-modified也不会发生改变
-
-
二叉树左侧看
我的想法就是树的层次遍历。面试官说大概思路差不多,就是用null做标识符可能不太雅观
1 2 3 4 5 6 7 8 => 1248 // 当时大概的代码 function leftSee(node) { const arr = []; arr.push(null) arr.push(node); while (arr.length > 0) { let t = arr.shift(); if (t === null) { arr.push(null); t = arr.shift(); if (t == null) return; console.log(t.value); } if (t.left) { arr.push(t.left) } if (t.right) { arr.push(t.right) } } }
二面
二面的面试官给人的感觉比较”随意“,感觉整个面试就像是在聊天。但是问的内容很发散,可能一个问题会涉及很多知识点。
自我感觉答的不是很好,主要的点达到了,但是很多都没有答全,面完都以为自己要挂了。感觉在平时写项目的时候需要更多的思考,这么写有什么优点,好在哪里,为什么好,又有什么缺陷。
-
自我介绍
-
说说Vue3的新特征
真实,真的真实!
当时主要说了两点:1. Proxy 替代了 Object.defineProperty,因为 Object.definePropetry 无法监听嵌套属性,需要递归,也无法监听数组,需要重写方法。2. 支持自定义渲染,目前Vue2底层的渲染API没有向开发者提供,像mpvue就是fork了整个Vue的源码,然后改了底层的渲染。其他还提了一下TypeScript,对象式声明,运行包大小。。
-
虚拟DOM
-
说说虚拟DOM和原始DOM相比的优缺点
只说出了优点:1. 利用JS的计算换取对DOM的操作,提高性能。2. 不需要直接操作DOM。3. 跨平台开发,weex
-
根据svelte框架,类比一下你还能说出什么缺点嘛?
我没听过svelte,面试官就简单介绍了一下那个框架的卖点。
懵逼脸🙃
-
-
BFC
-
是什么
块级格式化上下文,还有IFC、FFC、GFC
-
什么情况下使用
外边距塌陷,清除内部子元素浮动
-
该怎么触发
......愣是没想全😐,就想起来float不为none
-
-
移动端
-
移动端适配
@media 媒体查询加载不同的css,Flex,float布局。。
-
rem 和 em 的区别
感觉答的不好,之说出rem是基于HTML元素的字体大小决定的
-
-
Vuex用过modules吧,说说A文件内的actions怎么修改B的state
- 直接在A文件内引入B文件,调用B的actions😁。2. dispatch第三个参数为{root: true}
-
TypeScript
-
变量后面加上感叹号什么意思
忘了🙃,应该是非空断言
-
类型断言的方法
-
好处、缺点
-
-
Node
问我node掌握如何,我就说我只会使用,原理部分还在学习中。。。用过express和Egg
-
异步
-
看代码
async function test() { return 1 } async function call() { const a = test(); const b = await test(); console.log(a, b); } call();
-
这样写的结果是什么,有什么地方可以改进的嘛
async function test() { const resp1 = await getApi1(); const resp2 = await getApi2(); console.log(resp1, resp2); return 1 }
因为await会阻塞,所以getApi2要等getApi1返回结果了才会触发,可以使用Promise.all同时发起
-
-
Promise.all
大概写下Promise.all的原理吧
没看过,只能靠临场发挥了(自己挖的坑,哭着也要爬出来😭)
边写边与面试官交流,到后面说大致思路差不多,但还要我回去看看。。。
Promise.prototype.all = function(promiseArr) { const len = promiseArr.length; const result = new Array(len); let flag = 0; return new Promise((resolve, reject) => { promiseArr.forEach((cb, index) => { Promise.resolve(cb).then( res => { result[index] = res; // 注意数组中的顺序,当时直接写了push🙃 if (++flag === len) { resolve(result); } }, error => { reject(error) }) }) }) }
三面
三面的面试官应该是个主管,很和蔼,一上来就问我饭吃了嘛,面了很久了吧,要不要休息一下😊
三面个人觉得是比较轻松的一面,不涉及具体的API如何实现,主要考察从一个问题如何给出一个切实可行的解决方案,有很强的发散性思维,面试官会一步步引导给出一个较全面的解决方案。期间有提到用Vuex管理数据,面试官就直接说这个和Vuex没关系。面试官表达的需求很清楚,只要按照提出的需求切实的解决就ok
fortunately,三面结束,面试官说本来还要HR面,现在有点晚了,就明天吧。
-
自我介绍
-
重点项目介绍,难点挑战
我主要说了项目版本的迭代、中台的权限控制、模块化。。。
-
权限控制方案,怎么实现的,整体的思路如何
-
模块化是怎么划分的,具体做过哪些
-
提出了一个输入框远程搜索提示的功能
-
讲讲你实现的思路
提了大概的思路,防抖,巴拉巴拉
-
如果多次输入相同的内容怎么办
可以缓存在localStorage中,在发起请求之前先在本地查一下
-
这样每次都需要去localStorage取,有没有更好的方案
页面加载的时候从localStronge取出来存在一个Map中,页面离开的时候再将新的Map存到localStronge中
-
如果服务端的数据跟新了怎么同步localStronge中的数据
可以借鉴浏览器的缓存,加标识符将数据分为两部分:一段时间不会修改的,那么使用”强缓存";经常会修改的使用“协商缓存”,每次使用去服务器查一下看下有没有修改
-
-
说说版本是怎么迭代的
-
什么时候来实习
我提的问题
-
一面:
-
这段时间我学了Flutter和React,你觉得在有限的时间里是学更多的框架会使用,还是某一个比较深入的学习呢?
-
字节的技术栈
-
-
二面:
面试官后面有事,没给我提问的机会😥
-
三面:
- 字节有什么培养新人的方法嘛?
- 是研发为主,还是业务驱动?
友情链接
感谢PanJiaChen (vue-element-admin)大佬的内推码