关于领导让我面试别人,我准备了那些面试题
前端领导一天对我说你准备下面试题,然后我会筛选些简历给到你,你到时候负责一面。然后大致跟领导聊了下需要那样得,有没有什么具体要求。
大致就是要求能干活,不管是表格、echarts等能立刻上手,别是刚培训班出来得就行。
可能也是上个同事来了一个礼拜也没写出来什么太多东西。然后领导最后跟我们说他每天我看到再微信聊天, 让写个表格都能墨迹半天写服务器托管网不出来。本来再一周得时候都能看出大致水平了,但是领导觉得都招进来了好好学,每天积极学习也是愿意培养得。最后领导跟我们说他既然不愿意学,每天就是按时下班等情况吧就让人走了总共算是待了两个礼拜,工资也正常发放了。
我也是去看了好多面试得一些经验,希望能招到合适得同事,一荣俱荣,我也是想我招聘进来得同事能符合岗位要求,不然就是面试官得问题了。记得有一篇文章中说,你跟面试者身份是同等得,不过是你单位需要招聘。刚好我求职而已,不要趾高气扬得去问一些你不知道在哪里看到得新名词去为难人。
以下就是我准备得一些面试题,我觉得能答得七七八八基本满足干活要求了,然后可能回答得好的我也会基于原问题扩展下。回答不上来也没关系,能回答上来更好了。
Css
- 常用的伪类有哪些?
可能有些人会一时没想起来,哪有问这么简单得哈哈。我也会稍微提示下
:not
、:hover
…我可能更希望面试者能说点其他得比如first-child、last-child、nth-child、before、after
等等。
- css 说下弹性盒子;
这个也是工作中必须会的,我可能希望你能说的多点,当然不常用的那些对子盒子的一些属性除外。例如:
-
flex-direction
是更改方向的可以。 -
flex-wrap
是可以设置是否允许换行。 -
justify-content
x轴的对齐方式。 -
align-items
yz轴的对齐方式。
- 说下localstoage/ sessionStroge区别;
可以从大小啊、特性分别说下。
- 清除浮动的方法有哪些 分别说下
可以简单说下比如
overflow: hidden;
等。
- 说下重排和重绘 什么场景下会发生重排和重绘
希望面试者能了解dom是怎么样的刷新渲染机制,什么样下就发生重绘(color、background等)、什么样下会发生重排(更改宽高等)。
- 实现垂直居中的方法有哪些
希望面试者能说出两种就很好了,这两种也是经常会用到的,像还有个
display:table;...
这个我确实也没咋用到。只要能说出:
-
display: flex; justify-content: center; align-items: center;
; - 子元素
position: relative;left: 50%;top: 50%; transform: translate(-50%, -50%);
Js
由于我们可能是重前端多一点所以对数据转换会要求多点。所以我准备了一些数据处理的面试题如下:
1、请使用forEach、map、filter、some、every
等相关api对1,2,3...,10
这些数据进行处理:
- 请用相关api计算出
1-10
的累加。(期望得到一个Number: [1,2,3…]) - 请用相关api过滤出服务器托管网
1-10
大于5
的值。(期望得到一个Array: [1,2,3…]) - 请用相关api得到一个都是乘以*2的新数组(期望得到一个Array: [2,4,6…])
- 请用相关api查找出
1-10
中是否有数值11
(期望得到一个Boolean: true、false)。 - 请用相关api判断
1-10
中是否都大于5。(期望得到一个Boolean: true、false) - 请用相关api判断
1-10
中是否存在大于9数值的(期望得到一个Boolean: true、false)。
如果回答的很好,我还会多问问面试者假如不使用这些数组api函数的话,你能用
for
循环一样得到相关结果嘛。如果你能说的很好,我会再让面试者自己封装一个forEach、map、filter、some、every
那可就太棒了。
2、说下防抖、节流的场景以及怎么实现这些。
能说出防抖和节流的用处和场景,假如你能说对应用场景,实现都是使用
lodash
等或者找的方法使用的也能接收。但是还是希望能写出来一个自己如何实现防抖和节流的。
3、说下let/count区别
可以说下两者区别:常量不允许修改等。
-
let a = 1; let b = a; b = 2;
(这个时候a、b分别是什么值?)(加分项:说下原因) -
let a = {name: 1}; let b = a; b.name = 3;
(这个时候a、b分别是什么值?)(说下原因)
其实是希望面试者对堆、栈
有一定的了解。
4、事件执行机制setTimeout(() => { console.log(2)}, 0); const fn = new Promise(res => { console.log(3); res('success')}); console.log(1); fn.then(res => console.log(4))
以上代码会输出什么 执行顺序是啥样的(加分项: 说出理由)
其实是希望面试者对宏任务、微任务
有一定的了解,了解代码的执行机制。
5、说下箭头函数和普通函数的区别:
说完会继续问下bindapplycall 用法以及能力 (加分项:怎么实现一个bind、apply、call)
这里其实是希望面试者能对this
能有一定的理解。
6、说下对浅克隆/深克隆的理解 以及实现一个深克隆函数
这个问题可能会根据问题3回答情况问答。
7、说下怎么合并一个数组、对象。
{...obj1, ...obj2}
、Object.assign
。 数组可以使用concat
,如果回答的好我会再问下如何使用for
满足。
8、说下字符串常用的属性api
说完后会再追问下substr、substring的区别
9、说下数组的splice 和 slice的区别
10、const obj = {a: {b: {c: 123 } } };
希望你写一个get
函数如lodash.get(obj, 'a.b.c', '-')
一样的函数,就是可以通过传入a.b.c
获取到值得一个函数。
11、const originArray = [{name: '小明', a: 1}, {name: '小明', b: 1}, {name: '小红', a: 1}]
希望你对上面数据groupBy
name,得到{小明: [{name: '小明', a: 1}, {name: '小明', b: 1}], 小红:[{name: '小红', a: 1}]}
const originArray = [{name: '小明', a: 1}, {name: '小明', b: 1}, {name: '小红', a: 1}]
/** 调用groupBy(originArray, 'name')得到:
* {
* 小明: [{name: '小明', a: 1}, {name: '小明', b: 1}],
* 小红:[{name: '小红', a: 1}]
* }
/
如果JS回答的很好,基本已经能满足我们的招聘要求了。我后面也会对
vue
简单问问,放心哈哈 对源码没啥要求,我们要求是能干活就可以。
VUE
由于我们单位使用的是
vue
,我也会象征性的问一些用法相关的,如果你的js回答很好没有使用过vue
,一直再使用react
等框架,这个我就不会再问了,当然不影响我们的面试结果的,相信你js基础那么好,也就看下文档就能上手了。
- vue 组件间传值实现通信的方式有哪些?
- 有使用过vueBus嘛(加分项: 说下发布订阅者模式)
- 有用过
watch
嘛?watch
的deep
和immediate
都是干嘛的 有啥作用 (加分项怎么实现一个watch) - v-show 与 v-if 有什么区别?
- 说下vue的生命周期?
- 说下vuex的个人理解
- 说下nextTick使用场景
其实这里更希望你能说出获取dom等基本就符合问题了。但是如果能答出来
nextTick
是怎么设计的那可太棒了
- 说下路由hash、history的区别
这里面其实不只是想听到带不带
#
号,还希望你能说出两者会不会携带路由去请求html
,然后你们是怎么处理history
下404界面的。
加分项
一般达到这里已经满足我们得招聘要求了,这个时候我可能会多问一些完事把整体情况汇报给领导,由领导下决定选择谁入职
- 使用过canvas嘛(都用canvas再场景下实现了什么功能)
- 使用echarts都画过那些图表(解决过什么困难)
- 都用webpack做过什么?
- vue中假如请求api不以api/v1统一规范开头了 怎么实现接口转发?
结语
面试前还是要多准备准备,以上就是我面试新同事准备得一些面试题,其实好多同学都卡再了
js
,js基础不够扎实。 相比与学习框架api,语法,我更会花更多时间再js上面。 然后再去了解框架好的设计以及API得实现。
服务器托管,北京服务器托管,服务器租用 http://www.fwqtg.net
机房租用,北京机房租用,IDC机房托管, http://www.fwqtg.net