前端面试题(18)|求职季面试题分享|答案

171 阅读3分钟

1、移动端的适配方案有哪些?

答:(1) 响应式设计(Responsive Design)

(2)弹性布局(Flexible Box Layout,Flexbox)

(3)网格布局(CSS Grid Layout)

(4)视口单位(Viewport Units):使用  vw 、 vh 、 vmin  和  vmax  等视口单位来定义元素大小

(5)移动端优先(Mobile-First)

(6)使用适配工具

2、get请求和post请求的区别是什么?url地址参数可以隐藏吗?

答:GET请求和POST请求的区别:

(1) 数据传输方式:

GET:数据通过URL传递,添加在URL之后,以 ? 分隔符开始,参数之间用 & 连接。

POST:数据包含在请求体(request body)中,对URL不可见。

(2)数据大小限制:

GET:由于数据在URL中传递,受到URL长度限制,因此传输的数据量有限。

POST:没有大小限制,可以传输大量数据。

(3)安全性:

GET:数据在URL中可见,不安全,敏感信息不应通过GET请求传递。

POST:数据在请求体中,对外界不可见,相对更安全。

(4)缓存:

GET:可以被缓存。

POST:默认不缓存。

(5)URL地址参数可以隐藏:

虽然GET请求的参数在URL中可见,但“隐藏”参数通常指的是不在前端代码中直接显示敏感信息。例如:后端签名、Token认证、HTTPS、使用POST请求。

3、文本超出隐藏要用到哪些CSS属性?

答:(1)overflow :设置为  hidden  可以隐藏容器内超出部分的内容。

(2)white-space :设置为  nowrap  可以防止文本换行,确保文本在一行内显示,如果超出容器宽度,则会被隐藏。

(3)text-overflow :设置为  ellipsis  可以在文本超出容器宽度时显示省略号(...),表示文本被截断。

(4)max-width  或  max-height :限制容器的最大宽度或高度,以确保文本有足够的空间显示。

(5)display :对于需要使用  text-overflow: ellipsis;  的情况,通常需要将元素的  display  属性设置为  block  或  inline-block 。

4、页面中静态资源不大,数据也不多,但页面打开很慢,该如何排查问题?

答:(1)性能分析:使用浏览器的开发者工具分析页面加载的性能瓶颈。

(2)网络请求:检查网络请求,看是否有延迟或阻塞的资源。

(3)渲染优化:确保没有阻塞渲染的脚本或样式,优化 CSS 选择器。

(4)JavaScript 性能:分析 JavaScript 代码执行效率,避免长时间运行的脚本。

(5)浏览器缓存:确保利用浏览器缓存来减少加载时间。

(6)服务端响应:检查服务器响应时间,优化后端处理。

5、创建了两个Vue实例之间如何通讯?

答:自定义事件、Vuex、父子组件机制(props 和 events)、事件总线(Event Bus)

6、Freeze操作属于哪个属性?

答:Freeze  操作是一个方法,全称是  Object.freeze() 。这个方法用于冻结一个对象,一旦对象被冻结,你不能添加或删除属性,也不能修改它的现有属性的配置(即不能修改属性的 writable、enumerable、configurable 属性)。

7、Webpack打包原理是什么?

答: Webpack 打包原理的理解,包括它如何处理模块依赖、如何优化代码以及如何生成最终的静态资源。