每日五道面试题总结 22/7/26

一、什么是反向代理

反向代理是一种代理服务器，他代表客户端从一个或多个服务器检索资源，然后将这些资源返回给客户端，反向代理是任何客户端联系其关联服务器的中介，代理代表客户端行事，而反向代理代表服务器行事

二、spa 与 mpa 的区别

1、spa 单页应用  

   指向只有一个主页面的应用，一开始之需要加载一次 js，css 等资源，所有的内容都包含在主页面上，对每一个功能模块组件化，单页面应用跳转，就是切换组件，只刷新局部资源，

2、mpa 多页面应用 

指有多个独立的页面的应用，每个页面都必须重复加载 js，css 等相关资源，多应用跳转需要整页资源刷新

3、区别

结构：   spa： 一个主页+多个模块组合      mpa：许多完整的页面

体验：   spa 页面切换快，首次加载事时间过长 mpa：页面切换慢，体验差

资源文件：spa：组件公用的资源只加载一次   mpa：同左

适用场景：spa ：体验流畅要求较高    mpa：  适用于对SEO要求较高的应用

路由模式：spa：可以使用 hash 和 history   mpa：普通链接跳转

数据传递：spa：组件通讯，vuex    mpa：本地储存，cookie，URL参数等

三、CSS 盒子居中的方式

1、利用 margin    margin-left值=大盒子减去小盒子/2    margin-top=大盒子减小盒子/2

2、利用 定位 position 属性（子绝父相） top，left 都设为 50% 再用margin-top 与 margin-left 分别设置为小盒子高度宽度的一半

3、利用定位 （子绝父相） 设置margin  为 0 ，定位 top，left，right，bottom 都设置为0

4、利用 css3 新增属性 table-cell，vertical-align：middle  

     父盒子设置属性 display：table-cell    vertical-align:middle

     子盒子设置属性  margin  ： auto

5、直接在父元素食用弹性盒子

     父盒子设置属性：display：flex   justify-content：center     align-items：center

6、利用 transform 属性，外加定位属性（子绝父相）

     父盒子相对定位，子盒子绝对定位，外给子盒子X轴Y轴 负值平移子盒子一半距离

四、浏览器输入 url 到地址栏中到网页显示的过程？

1、解析域名

2、浏览器先查看浏览器缓存-系统缓存-路由缓存，如果缓存中有，那就直接显示页面内容，如果          没有就向服务器发送 TCP 请求

3、发起 TCP 三次握手

4、建立 TCP 连接之后发送 HTTP 请求

5、服务器收到请求，将数据返回至浏览器

6、浏览器收到 HTTP 响应

7、解析 HTML 标签，读取页面内容，浏览器渲染

五、For  in   与 For  of  的区别

for in  循环

用于遍历数组或对象的属性（对数组或者对象的属性进行循环操作）

for  in  循环中的代码每执行（循环一次），就会对数组的元素或者对象的属性进行一次操作

for of  循环

for of 循环 是 ES6 引入的新的语法，用 for of  循环遍历集合

在可迭代对象（包括  Array，Map，Set，String，argument 对象等） 上创建一个迭代循环，调用自定义迭代钩子，并为每个不同属性的执行语句

总结：

1、在循环对象属性时，食用 for - in 在遍历数组时使用 for - of

2、for-in循环出的是 key for-of 循环出的是 value

3、for-of 是ES6 新引入的特性 ，为了修复 ES5 引入的 for in 的不足

4、for-of 不能循环普通对象