唯品会前端面经+面试题集合

8.22接到唯品会的内推电面,问的问题都不难,聊了40分钟,结果没过。有点伤心(;′⌒`)
那就把面经发一发,顺便发一下在面试前搜集的网上的唯品会面经,整理出来了CSS和JS两大类问题,以及一些其他方面的问题,就当攒攒RP吧,给想去唯品会的小伙伴们一个参考。
每个问题都大概写了个答题方向,如果有不对的欢迎指正,有些问题没写答案,也欢迎小伙伴们给个方向。

面经

上来先让介绍一个最近做的项目,然后项目的难点是什么。我说了一个难点,然后又说了一个还在构想没实现的功能。面试小哥哥就跟我探讨了一下怎么去实现,但是感觉我跟他脑回路不太对的上,反正他把我的意思理解错了(不过下来想了想确实他的思路才更清晰)。
说完这个又问有没有做过大一点的很多网页的项目,我说之前跟同学一起做的一个购票网站。然后他问你们项目中网页怎么多,重复的像header和footer这种是怎么去实现的。我说当时就是复制粘贴。他就问你现在有什么其他想法没,我说可以用像webpack这样的构建工具去做一个模板再插入不同的内容(下来查了下也可以用react,vue这些框架的组件去实现)。
然后他就问用过webpack没,我说只是了解各项配置,没有具体去用webpack做过什么项目。
然后问了js的闭包,答完之后还问函数的作用域是定义的时候确认的还是调用的时候。我说定义的时候。他还再三跟我确认,吓得我差点以为自己答错了。
然后是HTTP缓存,又问如果是我的话怎么实现HTTP缓存。
问最近在学什么,这里我有点作死,他打电话前我正在看vue,他一问我就答这个了,但其实我才看了半个小时,问了几个基础点的问题都支支吾吾的,他就下一题了。
然后问为什么做前端吧。我说因为开心啊(是不是听起来不太靠谱哈哈哈(:з」∠)),多说了几句之后又问为什么想来唯品会,我说唯品会电商的话肯定会比较注重性能优化这块吧,我觉得可以学到很多东西。
然后他就问性能优化了,我说了一堆,说完之后他问你刚刚说了用CDN,那你跟我说说CDN吧。
我就说了CDN是什么,干嘛用的。他又让我说原理,这个我就有点蒙蔽了,不知道他到底想问啥。具体的反正也没答上来,然后时间差不多了。他就让我问问题了。

面试题整理

CSS类

  1. CSS盒子模型

    • Margin(外边距) - 清除边框外的区域,外边距是透明的。
    • Border(边框) - 围绕在内边距和内容外的边框。
    • Padding(内边距) - 清除内容周围的区域,内边距是透明的。
    • Content(内容) - 盒子的内容,显示文本和图像。
  2. position的几种值,相对谁定位,百分比以谁为参照

    • absolute:绝对定位,相对于static定位以外的第一个父元素进行定位

    • fixed:绝对定位,相对于浏览器窗口进行定位

    • relative:相对定位,按照元素的原始位置对该元素进行定位

    • static:默认值。元素出现在文档流中。

    • inherit:从父元素继承position属性的值。

      百分比以父容器为参照

  3. CSS reset

    因为不同核心的浏览器对CSS的解析效果呈现各异,导致所期望的效果跟浏览器的“理解”效果有偏差,css reset就是用来重置(复位)元素在不同核心浏览器下的默认值,尽量保证元素在不同浏览器下的同一“起跑线”。

    必要重置的元素才写,不要照搬全抄。

  4. CSS放在底部和顶部的区别(?)

    css放在顶部;如果放在底部,浏览器构建完DOM树,然后才开始渲染,当渲染树构建完成,又要重新渲染整个页面,造成资源的浪费。

    重要的CSS和JS放在顶部,次要的放在底部

    (JS放在body和header中的区别)

  5. CSS选择器的优先级

    CSS的选择器类型:标签选择器、类选择器、ID选择器、全局选择器、组合选择器、后代选择器、群组选择器、继承选择器、伪类选择器、字符串匹配的属性选择器、子选择器、CSS相邻兄弟选择器

    !important属性会覆盖任何样式,权重最高

    !important>行内样式>ID选择器>类选择器>标签>通配符>继承>浏览器默认属性

    后写的样式会覆盖先写的样式

    ID选择器是唯一的,不要再在前面写其他选择器了

  6. CSS link和import的区别

    • link是html标签,只能放在html源码中。link引入的css文件在页面加载之前完成。
    • @import url(...) ,import在html和css中都可以使用,相当于一种css样式。import引入的css会在页面加载完成后再加载。(如果写在头部的