有什么不对或者需要补充的地方还望各位大佬指出，大家共同进步。

一、css篇

1.实现垂直居中的方式

1.定位，移动50%,在使用transfor:translate(-50%)往反向走自身的50%

2.定位，然后将left,top,bottom,right都设为0，在margin:auto

3.flex布局

2.说一说你对盒模型的理解

盒模型分为：ie盒模型和怪异盒模型

ie盒模型：宽度=内容宽度(content) + margin + border +padding

怪异盒模型：宽度=内容宽度(content+border+padding)+margin

box-sizing属性控制：content-box和boder-box

3.display和visibility隐藏有什么区别

display：会发生重绘和回流，会从文档中移除

visibility：只发生回流，不会移除，仍然占据位置

4.为什么会要清除浮动，以及怎么实现清除浮动

当父元素没有指定高度，同时子元素又脱离文档流后，父元素不会被子元素撑开，所以需要清除浮动。

1.给后面加一个空标签，写入样式clear：both

2.给父标签overflow：hidden;*room：1

3.使用before和after伪元素

5.如何实现自适应

像百分比，vw，vh，rem(根据根html的size)，媒体查询

6.css3和html5新特性

css3：transfrom，annimation，新增的选择器，文本：如text-shadow等,边框：border-radus等，linear-gradient，flex布局，媒体查询等。

html5：语义话标签，input新增类型，video，audio，svg，canvas，地理定位，拖拽api，history api，webwoker，websokit，存储等。

7.css优先级

元素选择器：1

类选择器：10

id选择器：100

!important 最高

8.选择器有哪些

id选择器，类选择器，元素选择器，父选择器，后代选择器，伪类选择器，属性选择器等

9.哪些属性可以继承

可以：font-size，color，text-align等

不可以：background，border，margin，padding，width，height等

10.flex有哪些常用的属性

flex-direction，justify-content，align-items，flex-sharken，flex-wrap，flex-grow，flex等。

二、vue篇

1.说一说vue双向绑定原理

可以从2.0和3.0两个方面进行回答

2.说一说vue的生命周期

不要只说8个，应该说完整。加上keep-alive的actived、deactivated和处理异常的钩子函数errorCaptured和处理ssr的serverPrefetch

3.说一说为什么data要是一个函数

考察的点是作用域，变量冲突问题

4.vuerouter了解吗

两种模式，hash是根据url的#，histora是依赖html5出的api。在讲一讲路由懒加载。

5.vuex了解吗

回答出五个属性，然后在说一说只能通过mutains修改值的原因

6.mixins了解吗

可以实现可复用功能，与普通封装方法相比，mixins拥有生命周期函数，相当于一个组件

7.this.$nexttick用过吗

它是将回调延迟到下次DOM更新之后执行，可以简单讲讲事件循环。nexttick源码还没有去看过，有待学习。

8.$set了解吗

因为定义在data里的属性会一开始会被vue通过defineproperty监听到，如果在后端返回数据对象上加一个属性，vue是监听不了的，需要$set来实现监听。 vue提供了vue.set（）将set函数绑定到vue构造函数上，然后通过defineproperty实现监听。

9.vue3了解吗

可以讲解一下vue3的双向绑定， setup语法糖。

10.vue父子组件通信

11.如何使样式只在当前组件生效

12.v-if和v-show

可以说一说它两实现消失隐藏的区别，分别在什么情况下使用较好。

13.虚拟dom有了解过吗

为什么要使用虚拟dom，首先要了解浏览器渲染过程，首先会创建dom tree，然后构建style tree，根据dom tree和style tree构建 render tree，在根据render tree去找到对应的位置，进行标记，最后将它们显示出来。

每次操作dom，浏览器都会从头开始遍历，如果有多个dom节点有变动，浏览器也会构建多次，浪费了不必要的性能，其实一次更新是最好的。

虚拟dom是将dom节点以js对象的形式进行表示，它不会立即去进行构建重新渲染，它会等到最后一次构建，同时它也是局部渲染，会和真实dom进行比对，找出变化的地方，进行局部更新。

三、js篇

1.说一说有哪些数据类型

加上es6的symbol

2.判断数据类型的方法

typeof，instanceof，Object.prototype.toString().call() //样子 "[object,类型]"

3.闭包了解吗

可以讲闭包的定义和优缺点，然后在说一说科利华函数，它也是基于闭包实现的。

4.垃圾回收了解吗

可以讲一讲v8引擎

5.说一说es6

问map和set的话

https://www.jianshu.com/p/174cb389d46b

6.promise了解吗

可以先说一说为什么会有promise，然后在讲一讲promise的参数，状态（是否可逆），回调，api：race和all

7.async和await了解吗

实则也是返回promise

8.let、const、var的区别

9.浏览器缓存机制了解吗

强缓存和协商缓存，在讲一讲它们的字段。

10.输入url地址发生了什么

可能你会直接从域名解析开始说，其实它前面会先看是否有缓存，没有缓存才会进行域名解析。

11.常见状态码有哪些

主要：200，301，302，304，400，401，402，403，404，500，501，502

12.浅拷贝和深拷贝

1.通过递归遍历拷贝，得先判断是不是数组，在判断对象，因为数组也会被认作为对象

2.Object.assig()浅拷贝语法糖

3.JSON.parse(JSON.stringnify())深拷贝语法糖，但不能拷贝undefined,和方法

13.事件循环知道吗

因为js是单线程，进入开始执行后，在遇到宏任务或者微任务的时候会把它们放到各自任务队列里面去，等当前执行栈执行完之后，会从微任务队列开始取出到执行栈执行，最后在去执行宏任务队列里的。

四、其它篇

1.webpack有哪些常用的loader

file-loader，css-loader，less-loader，image-loader，babel-loader，eslint-loader，url-loader，style-loader，vue-loader

2.webpack有哪些常见的plugin

html-webpack-plugin，define-plugin，clean-webpack-plugin，mini-css-extract-plugin

3.项目中如何对性能进行优化

使用cdn，路由懒加载，使用精灵图（像emoji就是使用精灵图的形式），代码分割，代码压缩，部分输入框和按钮注意防抖和节流。

4.echarts如何实现自适应

echarts有提供一个resize方法

5.笔试题

笔试主要考察作用域，事件循环，排序，查询等。

6.如何看待前端这个岗位

7.未来的职业规划

应届生前端面试题笔记相关推荐

前端面试题笔记 2021.8.26
2021.8.26学习笔记如果需要匹配包含文本的元素,用下面哪种方法来实现? A. text() B. contains() C. input() D. attr(name) 正确答案: B tex ...
应届生web前端面试题_2020最新Web前端经典面试题试题及答案（持续更新）
Web前端面试题 Web前端面试题:说说你对webpack的看法解析:webpack是一个模块打包工具,可以使用webpack管理你的模块依赖,并编译输出模块们所需要的静态文件.能很好的管理.打包w ...
前端攻城狮学习笔记七：常见前端面试题之HTML/CSS部分（二）
前端页面有哪三层构成,分别是什么?作用是什么? 1.结构层:由 HTML 或 XHTML 之类的标记语言负责创建,仅负责语义的表达.解决了页面"内容是什么"的问题. 2.表示层:由 ...
真给力！蚂蚁金服工程师总结的400道前端面试题提供下载
最近很多小伙伴找我要一些前端资料,于是我翻箱倒柜,把这份蚂蚁金服大牛总结的前端开发归纳笔记找出来,同时赠送直播.录播.视频.笔记.源码.软件包,免费共享给大家! 据说有小伙伴靠这份笔记顺利进入 BAT ...
前端周报：前端面试题及答案总结；JavaScript参数传递的深入理解
1.2017前端面试题及答案总结 |掘金技术征文 "金三银四,金九银十",用来形容求职最好的几个月.但是随着行业的饱和,初中级前端er就业形势不容乐观. 行业状态不可控,我们能做的 ...
【前端】前端面试题整理
前端和计算机相关知识你能描述一下渐进增强和优雅降级之间的不同吗浏览器兼容问题如何对网站的文件和资源进行优化? 怎么学习前端?怎么接触前端新知识? 关于前后端分离关于浏览器内核(渲染引擎) 浏览 ...
前端面试题【131道】
前端面试题 1.vue2和vue3的主要区别 3.Apply/call/bind的原理是什么? 4.说说你对原型和原型链的理解? 5.说说你对ES6中Generator的理解 6.说说你对Event ...
2018最新Web前端经典面试试题及答案-史上最全前端面试题(含答案)--转载
版权声明:本文为转载文章,感谢博主小胖梅的博客,如有侵权,请联系我删除,谢谢转载链接: https://blog.csdn.net/xm1037782843/article/details/8070 ...
2021最新最全前端面试题（包含HTML、CSS、JavaScript、Vue、React、浏览器、算法与数据结构等）
整理了一些前端面试题,希望对正在找前端工作的伙伴有用.本篇文章内容篇幅较大,主要针对初中级前端开发工程师. 篇幅过长,大家可以先点赞收藏以后慢慢看. 关于HTML 的title和alt属性有什么区别 ...

应届生前端面试题笔记

一、css篇

二、vue篇

三、js篇

四、其它篇

应届生前端面试题笔记相关推荐

最新文章

热门文章