面试知识点
在面两个大公司和一个小公司的时候,尤为是一个传统行业的大型公司时,也有多是我年限的问题,尤为注意基础,不管是笔试仍是技术主管面试的时候都集中在这块,像原生JS、原生Ajax等,,(这些虽然我在工做中用的也不是不少ennnn,原生的是用的很少,可是我本身很注重),说下面试碰到的吧(一些记不住了,想起来我可能也来不及补了,我懒哦~)。javascript
HTML以及CSS篇,集中在CSS(CSS重要重要重要!)
-
说下你经常使用的几种布局方式
集中往盒模型、flex布局说(至于grid布局,这个我看过没有用到过)css -
实现水平居中的几种方法?html
-
animate和translate有没有用过,一些常见的属性说下?前端
-
CSS实现宽度自适应100%,宽高16:9的比例的矩形。vue
-
如何实现左边两栏必定比例,左栏高度随右栏高度自适应?html5
JavaScript篇(重要)
- 变量提高遇到的一些简单code题
- 说一下对闭包的理解,以及你在什么场景下会用到闭包?
- 说一下你对原型与原型链的了解度,有几种方式能够实现继承,用原型实现继承有什么缺点,怎么解决?
- iframe的缺点有哪些?
- Ajax的原生写法
- 为何会有同源策略?
- 前端处理跨域有没有遇到过,处理跨域的方式有哪几种方式去解决
- 怎么判断两个对象是否相等
- 代码实现一个对象的深拷贝
- 从发送一个url地址到返回页面,中间发生了什么
- 说下工做中你作过的一些性能优化处理
ES6篇(引导篇,相对重要)
这块面试官主要是问你哪块用的比较多,你能够引导性地把面试官往你会的地方说java
-
箭头函数中的this指向谁?node
-
如何实现一个promise,promise的原理,以及它的两个参数是什么?jquery
-
promise中第二个参数的reject中执行的方法和promise.catch()都是失败执行的,分别这么写有什么区别,什么状况下会两个都同时用到?webpack
-
map和set有没有用过,如何实现一个数组去重,map数据结构有什么优势?
计算机网络篇(相对重要)
emmmm(以前我在sf上打的是ennnn,一个小伙伴给我纠结了一下那我这里就纠正一哈),由于我专业是网络工程的,在华三和另外一家公司面试的时候没有被少问这些问题
PS:其实我心里很奔溃啊,大学我没有很认真听课哒,哭哭哭哭哭

- http、https、以及websocket的区别
- http常见的状态码,400,401,403状态码分别表明什么?
- 协商缓存和强缓存的区别
- 说下计算机网络的相关协议?
浏览器兼容性问题
这个重点说下(仅仅相对我本身来讲哈),由于个人工做主要还在专一在web端,因此浏览器兼容性的问题没有少碰到过,因主要是兼容IE8以上以及其余各个浏览器,这个就当作总结一下吧(在被问到这一块的时候其实我是有加分的,由于回答的比较多2333)
-
使用meta标签来调节浏览器的渲染方式,告诉浏览器用哪一种内核渲染,360双核浏览器就是在ie和chrome之间来回切换,如今使用meta标签来强制使用最新的内核渲染页面
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
-
rgba不支持IE8 解决:用opacity
-
CSS3前缀
-webkit- webkit渲染引擎 chrome/safari -moz gecko引擎 firefox -ms- trident渲染引擎 IE -o- opeck渲染引擎 opera
-
过渡不兼容IE8,能够用JS动画实现
-
background-size不支持IE8,能够用img
-
使用PIE.htc让IE6/7/8支持CSS3部分属性,像CSS3的border-radius,box-shadow,css backgrounds(-pie-background),Gradients,RGBA属性
.border-radius { border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; background: #abcdef; behavior: url(css/PIE.htc); }
-
用css hack
IE6: _ IE7/7: * IE7/Firefox: !important IE7: *+ IE6/7/8: \9 IE8: \0
-
IE浮动下margin产生的双倍距离,一般使用float:left来实现,浏览器存在兼容性问题,致使图片与 后面的内容存在margin不一致的问题,解决方法就是给图片添加diaplay:inline便可
-
ie8不支持nth-child,但支持first-child和last-child,能够经过转化写法来处理问题,span:nth-child(2)能够转换为span:first-child+span,可使ie8显示该内容,last-child能够自定义一个class类兼容ie8写法
-
IE8下不支持HTML5属性placeholder,解决问题的js插件挺多的,经常使用的使用jquery.JPlaceholder.js插件处理问题
-
识别HTML5元素,IE中可能没法识别nav/footer,使用html5shiv
-
火狐下表单阻止表单默认提交事件:在form中添加 action="javascript:",秒杀上述全部默认行为;
-
始终为按钮button添加type属性,IE下的默认类型是button,其余浏览器下的默认类型是submit
-
IE下删除全部没必要要的console语句,IE下当遇到console时不识别以后报错,代码不会执行,或者全局自定义一个window.console方法
-
IE浏览器下因为参数过长致使经过GET请求下载文件方法报错,解决改成POST请求
-
IE浏览器下iframe弹窗中输入框光标丢失(没法输入)问题,解决清一下frame
-
兼容IE8 new Date()返回NaN问题,解决自定义方法
function parseISO8601(dateStringInRange) { var isoExp = /^\s*(\d{4})-(\d\d)-(\d\d)\s*$/, date = new Date(NaN), month, parts = isoExp.exec(dateStringInRange); if(parts) { month = +parts[2]; date.setFullYear(parts[1], month - 1, parts[3]); if(month != date.getMonth() + 1) { date.setTime(NaN); } } return date; }
Vue相关知识点 (框架之一重要)
由于我简历上主要写的是会vue啦,其实也不是精通,由于边学边开发,主要是实践的项目不是特别复杂,不过常见的一些坑点仍是有遇到的啦,这个是看你会的框架问相应的知识点
-
简单阐述一下vue的生命周期
-
如何实现一个自定义组件,不一样组件之间如何通讯的?
-
父子组件如何通讯的?
-
前端路由有没有用过,你在项目中怎么实现路由的嵌套?
-
nextTick和Vuex两个有没有用过,分为何状况下用到?
-
Vue的响应式原理你知道是怎么实现的吗?你以为订阅者-发布者模式和观察者模式有区别吗?有的话,说一下它们的区别。
构建相关
由于项目还在先后端未分离的时候,我研究的gulp比较多,像grunt、fis3也有了解过,webpack打包工具在用vue的时候确定也接触到啦,可是研究不深,只能算入门阶级(别吐槽,实践确实很少),因此我就直接很诚实地和面试官说了,面试官好像也能理解也就没有这么问(内心暗自开心哈哈哈哈),不过我以为仍是有必要都去熟悉或者实践一下,多知道一点不会死哒!
Other
有一些技术主管会考量一下你除了前端以外的技术能力,例如你熟悉的后端语言,sql会不会,还有人问我Linux命令会不会的(我心里:不会不会不会====),哈哈哈,不过node多多少少都有在用,这个也是前端应该要会的啦(but技术小白我不会,只是用到一点点~)
PS:对啦,忘记说啦,还有版本控制工具svn和git,大部分会问你git会不会,这个用了github的确定都会啦,我以前公司代码的控制工具都是svn啦,不过git我如今也很自信地说会啦,毕竟入职一周了唉唉唉~
做者:Qin菇凉~
连接:https://juejin.im/post/5af99678f265da0b8e7f881e
来源:掘金
著做权归做者全部。商业转载请联系做者得到受权,非商业转载请注明出处。