web前端常考面试题

HTML

从输入URL地址到页面展示发生了什么？

1.输入URL后解析出协议、主机等信息，并构造一个HTTP请求
2.判断强缓存、协商缓存
3.DNS域名解析
4.TCP连接（为什么要三次握手）
5.http请求
6.服务器处理请求并返回HTTP报文
7.浏览器渲染页面
8.断开TCP连接

CSS

1. 盒模型介绍：标准盒模型、IE盒模型
   都是由content+padding+border+margin构成，大小都是content+padding+boder决定，但是盒子内容宽高计算不一样。
   ·标准盒模型：只包含content
   ·ie盒模型：content+padding+border
2. css选择器和优先级
   !import > style > id > class
3. 重排和重绘
   重排一定重绘，重绘不一定重排。
   重排：无论通过什么方式影响了元素的几何信息(元素在视口内的位置和尺寸大小)，浏览器需要重新计算元素在视口内的几何属性，这个过程叫做重排。
   重绘：通过构造渲染树和重排（回流）阶段，我们知道了哪些节点是可见的，以及可见节点的样式和具体的几何信息(元素在视口内的位置和尺寸大小)，接下来就可以将渲染树的每个节点都转换为屏幕上的实际像素，这个阶段就叫做重绘。
   4.实现两栏布局（左侧固定+右侧自适应布局）
   5.实现圣杯布局和双飞翼布局（经典三分栏布局）
   目的：
   三栏布局，中间一栏最先加载和渲染
   两侧内容固定，中间内容随着宽度自适应
   圣杯布局用padding，双飞翼布局用margin
   6.水平垂直居中多种实现方式
   7.flex布局

js基础

1.数据类型
2.数据类型判断的方法
3.instanceof手写
4.手写深拷贝
5.原型和原型链
6.作用域和作用域链
7.执行上下文
8.闭包
9.事件循环、宏任务和微任务
10.Promise
11.web存储（cookie、localStorage、sessionStorage）

HTTP

1.常见的Http状态码
2.强制缓存
3.协商缓存

Vue

1.双向绑定原理
2.v-if和v-show的区别
3.data为什么是一个函数而不是一个对象
4.vue中的生命周期
5.组件间通信方法
6.vue中性能优化有那些
7.常见的事件修饰符及作用