微软一面
一轮面试是纯中文面试,软件用的Microsoft的teams进行视频
自我介绍
你为什么要学习前端呢,是什么原因让你往这个方向发展(学校有写代码的课,学到web开发的时候我觉得这个方向还挺有意思)
你平时怎么学习的呢(看博客,看书,看文档,看资料,看视频,写demo)
介绍项目,包括是个人独立完成的吗,为什么要做这个项目,这个项目中你收获了什么
你简历上写你在做这个组件库时解决了一些难点,具体说说(我主要介绍了一些开发上的难点,面试官似乎要的并不是这个答案,他要设计组件的思路,为什么要这样设计)
React和Angular的区别有哪些(我实在是没有学过Angular,听说Angular也挺难的,我只说我学过React和Vue,然后说了一些React和Vue的区别)
那就从React开始吧,讲讲React中的组件通信有哪些方法(我说props传参,useRef可以实现子向父组件传参,useContext配置好Provider后可以实现内部各个组件之间的传参,还有redux,mobx,recoil这些库也可以实现)
你提到了useRef,具体讲讲怎么用的(这些天一直在背面经刷题,确实不太记得useRef实现具体的一些参数了,我只好说具体的不太清楚)
useState的原理了解吗(我讲了一下setState在遇到浏览器原生事件的时候是同步操作,而在React可以控制的事件如生命周期,合成事件中是异步调用的)
那再来做一道关于setState同步异步的题目吧,输出的结果是什么(我关于这部分了解得确实不够透彻,报了个错误的答案,正确答案是 0 0 2 3)
class App extends React.Component { state = { val: 0 } componentDidMount() { this.setState({ val: this.state.val + 1 }) console.log(this.state.val) this.setState({ val: this.state.val + 1 }) console.log(this.state.val) setTimeout(_ => { this.setState({ val: this.state.val + 1 }) console.log(this.state.val); this.setState({ val: this.state.val + 1 }) console.log(this.state.val) }, 0) } render() { return <div>{this.state.val}</div> } }
redux有用过吗,具体的实现原理是什么(redux实现原理我猜是useReducer,我真不记得了啊哥)
redux怎么使用,举个例子(redux我真的真的好久没用了,写不出来)
js事件循环介绍一下(我正准备说大概的执行流程,直接就出题了)
说说输出什么(在这里我错把setImmediate当成了微任务,出了一点错,其它的没啥大问题)
console.log(1); setTimeout(() => { console.log(2) }); process.nextTick(() => { console.log(3); }); setImmediate(() => { console.log(4) }); new Promise(resolve => { console.log(5); resolve(); console.log(6); }).then(() => { console.log(7) }); Promise.resolve().then(() => { console.log(8); process.nextTick(() => { console.log(9) }); });
说说js中的变量提升(我举了个例子,var a = 2,那么首先声明a = undefined,然后才赋值 a = 2)
你知道什么是暂时性死区吗(我听过很多遍这个名词,但是居然没有详细复习到)
那好,做道题(我说第一个会报错,第二个会输出这个函数因为函数提升了,第三个输出123(这里答错了, 因为这个形成了暂时性死区,所以会报错而不是输出123)
console.log(b); let b = 0; console.log(c); function c() {} var tmp = 123; if (true) { tmp = 'abc'; let tmp; } console.log(tmp);
二叉树了解吗,做道题吧 ******** 572. 另一棵树的子树。(但是面试官并没有给********那样的可以测试的环境,而是直接在本地编辑器中运行,需要自己写二叉树的结构函数,自己写测试用例。但是面试官给的两个数组我突然不记得怎么转成树了,测试用例没写出来,但是讲了一下大概的思路,当然,第一时间想到的就是深度优先搜索暴力匹配然后讲了一遍,面试官又给我换了道题)
再来一道题,将 [1, 2, 3, 1, 2, 3, 4, 6, 6, 8, 9, 10] 转换为 ["1-3","1-4", 6, "8-10"],连续的数字就用“-”把首和尾连接起来(用双指针秒A)
再谈谈CSS吧,说说怎么实现垂直居中(flex布局的align-item设置为center,绝对定位时top: 50%,tranform: translateY(-50%),margin: 0 auto我都说进去了)
margin能实现垂直居中吗(面试官和我说不能,只能实现水平居中,这个没复习确实又忘记了)
行内元素怎么垂直居中(line-height设置为等于父元素容器的高度)
反问(1.日常工作?2.我能学到什么?面试官都解答得比较详细)
微软二面
一面之后紧接着就是二面
面试官人在美国,跨洋的网络可能不太好,进去就卡了半天他听不到我的声音,然后全程都有卡顿的情况,后面甚至开始聊天框交流
没有自我介绍
开始聊天(面试官说我简历上东西好少,我心想当然,我大三而且还没有实习过,当然经验少啦)
继续聊天(你这专业是干啥的,我觉得还挺有意思,然后聊了聊专业,但是面试官总是夹杂着英文,有些我真的还得楞一会才能回过神来猜到是啥意思)
还是聊天(你为啥学前端,我重复了一面时候的话术)
你这些项目都是自己做的吗(是的,都是自己做的)
共享一下屏幕,展示一下你这两个项目(第一个项目可以跑,而且我把基本功能都演示了,但是组件库,这个演示不了哈哈)
聊点技术吧(你觉得React和Angular有啥区别,又是一面已经问过的问题)
你觉得React有啥好处(我随意自由发挥了一下,答得不好)
接下来又是聊了好多React相关的,但是都是比较浅层的,不涉及具体的探讨
手写代码,s = "12223333752",请你输出"1,8,12,7,5",即合并相同的数字并按顺序输出(我一开始用map,面试官问我为啥要用map,要按顺序输出,我又换成二维数组,面试官也说不用二维数组,直接遍历就行,直接遍历我没写出来,一个原因可能是根本不会,另一个原因可能是懒,没吃早饭已经不太想思考了)
反问(1.日常工作2.学到什么 二面面试官回答得比一面面试官简略,麦克风后传来小朋友的声音,说着流畅的英语)
总结:寄