前端面试总结

[cy0707]

前言

突然想起以前面试的时候，面试官问我的问题，有好多我都回答不出来，所以专门面试问题记录下面。

     --------------------------------------  2016.8 ---------------------------------------

问题一：四大浏览器的内核的名字以及这些浏览器私有前缀？

• IE浏览器的内核------ Trident 私有前缀 -ms
• Firefox浏览器的内核 ------ Gecko 私有前缀 -moz
• Operal浏览器的内核 ------ Presto 私有前缀 -o
• 谷歌浏览器的内核 ------ webkit 私有前缀 -webkit

问题二： 浏览器标准模式和怪异模式之间的区别是什么？

由于历史的原因，不同浏览器对页面的渲染是不同的，甚至同一浏览器的不同版本也是不同的。在W3C标准出台之前，不同的浏览器在页面的渲染上没有同一的规范，产生了差异，即Quirks mode(怪异模式或兼容模式)；当W3C标准出台之后，不同浏览器对页面的渲染有了统一的标准,即Strict mode（标准模式或严格模式）；这就是两者之间的区别。

在标准模式中，浏览器根据规范呈现页面；在混杂模式中，页面以一种比较宽松的向后兼容的方式显示。

如果XHTML文档包含形式完整的DOCTYPE，那么它一般以标准模式呈现。

对于HTML 4.01文档，包含严格DTD的DOCTYPE页面以标准模式呈现。包含过渡DTD和URI的DOCTYPE也导致页面以标准模式呈现，但是有过渡DTD而没有URI会导致页面以混杂模式呈现。

DOCTYPE不存在或形式不正确会导致HTML和XHTML文档以混杂模式呈现。

     --------------------------------------  2017.2.24 ---------------------------------------

自我介绍

记录这次的面试情况吧，在面试的时候，面试官让我自我介绍，好吧，这么多次的面试，都是从自我介绍开始，那好吧那我就自我介绍，自我介绍的时候，我说的是，我先后工作的两个公司的情况，说我如果如何由一个UI设计师成为一个前端切图仔。

自我评价：介绍的毫无逻辑，完全无重点，语速太快，这个是老毛病了，无奈，也不知道面试官到底听清楚我的话没。

面试官提问

问题一： 是给紧挨着span的p的写一个样式，但是不能起class的名字，要求兼容IE8。

好吧这个问题，其实我当时想的是不是有一个css的选择器中有一个紧挨着某个元素的那个选择器，当时我确不知道怎么写这个选择器了，我要查一下才知道。

后来，我还答了，给最外层起一个class,用last-of-type取得最后一个span，再用紧挨着的那个元素选择器。

<div>
   <span></span>
  <span></span>
  <span></span>
  <span></span>
  <span></span>
   <p></p>
  <p></P>
</div>

回来查了一下，css选择器，紧挨着某个元素的选择器的的写法element+element。向下面这种写法。

span+p {
  color:red;
}

自我评价：我还大言不惭的说，css是我强项。---------结果我的强项，竟然是这样的，这样的，我还真好意思。。。。从这里可以看出我的基础还是不太扎实，对于不常用的，记不牢。就这样开始了，我想面试官，已经在心里对我说了，这就是你最强的。。。。呵呵呵。。。。应该不再对我抱有希望了，不过还是
继续对我提问，难为他了。

问题二：一个简单的javaScript闭包问题。可是我竟然紧张到外面的for循环了，只写了一个答案。在这里我竟然还是，我希望以后能专攻js,此时面试官的心里，应该是这样的，就你这样还js,呵呵呵。。。。

问题三：还问了你遇到最大的困难，你是怎样解决的？

问题四：es6和react的生命周期？

对于这个问题，前一天准备了一下，花了差不多两个小时把react的api,差不多就大致了解了一下，晚上的时候，把ES6常用的相关知识了解了一番-----let,const,class,super,extends,rest,export,import,字符串模板，
箭头函数，promise等等。这题过。

问题五：那关于ajax的跨域？

其实这个问题的都总结过了，但是我就是答不出来，归根究底就是自己不熟悉，不会。

问题六：你平时用什么抓包工具？

啊哈，什么？你说什么，抓包工具。。。。没用过。。。

**问题六：如果，给你一个场景，在webview中，你替换了一张图片，在浏览器中，查看出来的是新替换的那个图片，但是在用户手机中确是以前的那张图片，你怎样快速定位这个问题，造成的原因？ **

啊。。。。什么？webview....我没用过，可能是缓存吧。但是你不可能让用户清理缓存啊。。。。所以不知道。。。我真的不知道啊。

问题七：关于框架？

你平时就只用过jquery是吧，嗯。是的，我平时的话，大部分只用这个，其他的用不到。。。。。。

问题八：你还学习PHP和数据库？

你php到了什么程度，啊，就会一点基础，那你的数据库了，会基本的增删改查了吗。。啊，我最近才了解基础，只会在控制台上面操作数据库呢。。。。

问题九：W3C的盒子模型和IE的盒子模型的区别？

啊，这个问题，我还是没特别注意过。那个对于宽度的设置更合理了。当然是W3C了，因为是规范的嘛。
回来查了一下：

W3C 盒子模型的范围包括 margin、border、padding、content，并且 content 部分不包含其他部分
。即宽度及content；
IE 盒子模型的范围也包括 margin、border、padding、content，和标准 W3C 盒子模型不同的是：IE 盒子模型的 content 部分包含了 border 和 pading。即宽度为：content+padding+border。

对这次面试的总结：我要是面试官，我也不会要我自己。就我这水平还想面试成功，呵呵呵呵。。。

• 语速太快
• 基础不牢
• 先听清楚题目，再慢慢的回答
• 框架用的不多
• webview不会
• php和数据库不太熟悉