前端web 企业真实面试题真题 20道带答案（7）

一染星辰

已于 2022-04-13 19:05:21 修改

阅读量881

点赞数 2

分类专栏：企业真实面试题文章标签：前端面试题

于 2022-04-13 19:02:40 首次发布

本文链接：https://blog.csdn.net/weixin_59519449/article/details/124155091

版权

本文整理了20道前端面试中的常见问题，涵盖了盒模型、BFC、数据类型、this指向、null与undefined的区别、前端存储、比较运算符、数组方法、循环区别、原型链、Vue特性和生命周期、组件数据处理、状态管理和本地存储等方面，旨在帮助开发者更好地准备面试。

摘要由CSDN通过智能技术生成

18.vuex和localstorage区别？

19.vue中SSR是什么？（重点）

20.vue中key作用？

1.简述盒模型？

CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距margin，边框border，填充padding，和实际内容content。盒模型允许我们在其它元素和周围元素边框之间的空间放置元素

2.说说BFC？

BFC（Block Formatting Context）格式化上下文，是Web页面中盒模型布局的CSS渲染模式，指一个独立的渲染区域或者说是一个隔离的独立容器。

BFC应用

防止margin重叠

清除内部浮动

自适应两（多）栏布局

防止字体环绕

触发BFC条件

根元素

float的值不为none

overflow的值不为visible

display的值为inline-block、table-cell、table-caption

position的值为absolute、fixed

BFC的特性

内部的Box会在垂直方向上一个接一个的放置。

垂直方向上的距离由margin决定

bfc的区域不会与float的元素区域重叠。

计算bfc的高度时，浮动元素也参与计算

bfc就是页面上的一个独立容器，容器里面的子元素不会影响外面元素。

3.块级元素有哪些，行内元素有哪些？

行内元素有：

b,big,i,small,tt

abbr,acronym,cite,code,dfn,em,kbd

strong,samp,var

a,bdo,br,img,map,object,q

script,span,sub,sup

button,input

label,select,textarea

块级元素有：

address、article、aside、audio、blockquote、canvas、

dd、div、dl、fieldset、figcaption、figure、

footer、form、h1、header、hgroup、hr、noscript、

ol output p pre section table tfoot

ul video

4.display的指向说明，有什么作用？

css里的display属性的作用是规定元素应该生成的框的类型。display属性是前端开发中常用的一个属性，常用的属性值有block、none、inline、inline-block。

block：将元素将显示为块级元素，元素前后会带有换行符，通常用于将行内元素转换为块级元素时使用。

display:none这个值表示元素不被显示。当你想要某个元素隐藏时，就可以给某个元素设置这个属性，它就会消失在网页中，但元素并没有在文档中删除，只是隐藏在网页结构中，不在网页中显示而已。但如果你想要元素显示的话，可以给元素设置display:block，元素就可以显示在网页中了。

display:inline 的作用可以将一个块级元素转换成行内元素，那么这个块级元素将不能再设置宽和高以及上下方向的margin和padding。这个块级元素实际的宽度和高度都是auto，并不是我们设定的值。

display:inline-block我们可以得到它是结合了inline和block并保留了它们的特性。所以设置了inline-block属性的元素既具有block元素可以设置width和height属性的特性，又保持了inline元素不换行的特性。