前端面试-解决拟定的问题

1.请简述下http和https两者

http是一种应用最广泛的网络传输协议，是一个客户端和服务端请求和应答的标准（TCP），它可以使浏览器更加高效，是网络传输减少。

https其实就是http的安全版本，在http下加入了ssl层。他的主要重要是：建立信息安全的通道，确保数据传输的真实性和确认网站的真实性

两者之间的主要区别：

• 1.https需要在ca申请证书，不是免费的；
• 2.http是超文本传输协议，明文传输。https是具有安全性的ssl加密传输协议；
• 3.http和https使用的是完全不同的连接方式，用的端口也不一样，http80，https443；4.http的连接很简单，是无状态连接

http和https都是基于TCP协议，他们只是一种传输标准，本质上还是tcp传输

http发展历史：

• 0.9 只有get命令；
• 1.0 加入post和head；每次建立TCP只能发送一个请求，性能很差；
• 1.1 直到现在仍然是最流行的版本。 长连接，tcp连接默认不关闭；管道机制，可以发送多个请求；分块传输，提高传输效率；请求头增加HOST字段，指定服务器的域名；新增几个命令

2.请说下浏览器事件循环机制（可延伸至node上的事件循环机制）

event loop js主线程不断的循环往复从任务队列中读取任务，执行任务，其中的运行机制称为事件循环机制

说事件循环机制首先搞清楚，宏任务（macrotask， script, setTimeot,setInterval,I/O,UI,交互事件,setImmediate(nodejs)）和微任务（microtask）

浏览器，每执行完一次宏任务，就会把队列中所有的微任务清空

JS 主线程拥有一个 执行栈（同步任务） 和 一个 任务队列（microtasks queue）

3.请介绍下跨域和跨域的解决方式

浏览器的同源策略，协议、ip、端口三者中有一个不同就是跨域

1.jsonp，把请求封装成scrpit，只支持get请求

2.cros，需要后台开发人员配合设置，关闭跨域防火墙

3.iframe

4.nginx,方向代理

4.请简单介绍下javascrpit的垃圾回收机制

5.你平时如何对前端页面的性能进行优化（扩展移动端性能优化）

从开发者自身层面来说，良好的编码习惯，减少不必要的冗余，去除多余的打印都是对性能有一定的优化

优化的常规方法有

1.减少http请求数

2.尽量避免使用第三方动画

3.使用csssprites进行图片资源整合

4.webpack打包，模块化处理

5.减少页面的重绘和回流

6.合理设置http

6.请介绍下状态码200和304他们各自的意义

200表示正常的请求应答

304是缓存协商。延伸出协商缓存。请求中有个etag和last-modified时间，如果last-modified改变但是etag没有改变（可能打开修改但是还原了，last-modified会改变但是实际文件没有改变），表示客户端资源没有改变，直接答复304用客户端本地的资源

7.ES6和ES5到底有哪些区别

8.简单介绍下js的继承

es6使用的class、extends语法糖

9.分析下各种存储方式（cookie、seesion、localstorage、sessionstroage、webstroage）

cookie localstorage sessionstorage 保存在浏览器端，并且是同源的

cookie，存在于浏览器中，主要用来存sessionId，大小限制4k,一个domian最多20个，同个设置set-max-age来控制存放时间，没有直接删除的方法，可以把max-age设置为0就删除了

session,存在于服务器中，主要用来存放用户什么信息，和cookie配合使用

localstorage,存在于浏览器中，关闭浏览器依然存在，需要手动删除

sessionStroage,是会话缓存，关闭会话窗口，缓存消失

10.tcp三次握手，四次挥手简单介绍下（能 画出图来）

ACK（确认值，Acknowledgment）1表示确认连接； ack（确认编号，Acknowlegedgment Number）收到远端传来的seq然后加1

握手：

• 客户端给服务端发送syn同步号和seq=x随机值
• 服务端返回SYN=1,ACK=1, 随机值seq=y，确认编号ack=x+1
• 客户端返回确认ACK=1，序号seq=x+1, ack=y+1

挥手，（为什么挥手是四次？因为双方都需要确认对方还有没有需要传输的东西，属于4次两组挥手确认。仅仅表示对方不再发送数据了但是还能接收数据，己方是否现在关闭发送数据通道，需要上层应用来决定，因此，己方 ACK 和 FIN 一般都会分开发送）

• 客户端发送断开连接请求FIN=1, 随机值seq=u
• 服务器确认客户端发送的断开请求ACK=1,seq=v,ack=u+1
• 服务器发送断开请求FIN=1,随机值seq=w,ACK=1,ack=u+1
• 客户端确认服务器发送的断开请求 ACK=1,ack=w+1, seq=u+1

11.promise / promise.all / promise.race（能手撕）

12.mvvm 和 mvc的区别和发展历程（扩展知道mvp）

最大的区别就是MVVM实现了view和model之间的自动同步，当model里面发生改变时，不需要我们再手动去更新dom

13.vue是如何实现双向绑定的

14.vue 路由（和路由相关的知识点）

15.浏览器如何渲染一个页面的

16.js数据类型

17.手写快速排序，插入排序

18.get post的区别

19.h5的新特性

20.css3新特性

21.http状态码

22.bind  call  apply之间的区别

浮动、清除浮动？