主要考察HTML中src和href使用上的差异。

href 指网络资源的位置，在超链接中建立与当前元素(锚点)或当前文档(链接)的链接。

1. 域名解析

2. 发起TCP的3次握手

3. 建立TCP连接后发起http请求

4. 服务器端响应http浏览器获得请求html代码

5. 浏览器解析html并请求代码html代码中的资源

6. 浏览器渲染页面并呈现给用户
   

这是前端面试中常见的考点，主要考察学生对同步和异步的理解
。

同步是阻塞模式，异步是非阻塞模式

同步是指在执行请求时，如果需要一段时间才能返回信息，则该过程将继续等待，直到收到返回信息；

异步是指这个过程不需要等待，而是继续执行以下操作，不管其它过程的状态如何。当有消息返回时，系统会通知过程进行处理，从而提高执行效率。

这个问题也是前端面试的重点，主要考察前端学生对深/浅拷贝的理解及其区别。

浅拷贝是一种具有原始对象属性值的新对象的精确拷贝。若属性为基本类型.复制是基本类型的值。如果属性是参考类型，复制是内存地址。
从内存中完全复制一个对象，开辟内存中开辟新的区域存储对象。
区别：浅拷贝的基本类型以前没有相互影响。如果引用类型中的一个对象改变了地址，则会影响另一个对象；深拷贝
改变新对象不会影响原对象，他们以前也不会互相影响。

本课题主要考察前端界面的三层结构。

网页分为三个层次，即:结构层、表示层、行为层。

1.网页的结构层（structurallayer）由HTML 或XHTML此类标记语言负责创建。标签，即出现在尖括号中的单词，不包含任何关于如何显示相关内容的信息。
2.网页的表示层（presentationlayer）由CSS 负责创建。
3.网页的行为层（behaviorlayer）负责回答"如何应对事件？"这一问题。

这个面试题主要考察form表单中的get和post的差异。

1. Get它是用来从服务器上获取数据的Post用于向服务器传输数据。
2. Get按表单中的数据variable=value添加形式action所指向的URL后面，使用两者"?在每个变量之间使用连接&"连接。Post将表单中的数据放在表单中form在数据体中，根据相应的变量和值传输到action所指向URL。
3. Get是不安全的，由于数据在传输过程中被放置在请求中URL中，而如今现有的很多服务器、代理服务器或者用户代理都会将请求URL记录在日志文件中，然后放在某个地方，这样第三方可能会看到一些隐私信息。用户还可以直接在浏览器上看到提交的数据，一些系统内部信息将在用户面前显示。Post所有操作对用户来说都是看不见的。
4. Get这主要是因为传输的数据量很小URL长度限制。而Post大量数据可以传输，只能用于上传文件Post。
5. Get限制Form表单数据集的值必须是ASCII字符。而Post支持整个ISO10646字符集。
6. Get是Form的默认方法。

这道面试题是前端面试经常问的问题，主要考察了浏览器会话session和cookie的不同。

cookie保存在客户端（浏览器）；session保存在服务端（redis）
Session是由应用服务器维持的一个服务器端的存储空间，用户在连接服务器时，会由服务器生成一个唯一的SessionID,用该SessionID 为标识符来存取服务器端的Session存储空间。

cookie的优点：

1.极高的扩展性和可用性
2.通过良好的编程，控制保存在cookie中的session对象的大小。
3.通过加密和安全传输技术（SSL），减少cookie被破解的可能性。
4.只在cookie中存放不敏感数据，即使被盗也不会有重大损失。
5.控制cookie的生命期，使之不会永远有效。偷盗者很可能拿到一个过期的cookie。

cookie的缺点：

1.cookie数量和长度的限制。每个domain最多只能有20条cookie，每个cookie长度不能超过4KB，否则会被截掉。
2.安全性问题。如果cookie被人拦截了，那人就可以取得所有的session信息。即使加密也与事无补，因为拦截者并不需要知道cookie的意义，他只要原样转发cookie就可以达到目的了。
3.有些状态不可能保存在客户端。例如，为了防止重复提交表单，我们需要在服务器端保存一个计数器。如果我们把这个计数器保存在客户端，那么它起不到任何作用。

本问题主要考察考生对Vue中MVVM模式的理解

MVVM分为Model、View、ViewModel三者。
Model 代表数据模型，数据和业务逻辑都在Model层中定义；
View 代表UI视图，负责数据的展示；
ViewModel 负责监听 Model 中数据的改变并且控制视图的更新，处理用户交互操作；
Model 和 View 并无直接关联，而是通过 ViewModel 来进行联系的，Model 和 ViewModel 之间有着双向数据绑定的联系。因此当 Model 中的数据改变时会触发 View 层的刷新，View 中由于用户交互操作而改变的数据也会在 Model 中同步。
这种模式实现了 Model 和 View 的数据自动同步，因此开发者只需要专注对数据的维护操作即可，而不需要自己操作 dom。

本题主要考察Vue框架的指令。

vue常用指令有：v-once指令、v-show指令、v-if指令、v-else指令、v-else-if指令、v-for指令、v-html指令、v-text指令、v-bind指令、v-on指令、v-model指令等等。

其中，v-show和v-if的区别如下：
v-show 仅仅控制元素的显示方式，将 display 属性在 block 和 none 来回切换；而v-if会控制这个 DOM 节点的存在与否。当我们需要经常切换某个元素的显示/隐藏时，使用v-show会更加节省性能上的开销；当只需要一次显示或隐藏时，使用v-if更加合理。

本题主要考察对协议的理解，求职者可以从它们的相同点和不同点答起。

http传输的数据都是未加密的，也就是明文的，网景公司设置了SSL协议来对http协议传输的数据进行加密处理，简单来说https协议是由http和ssl协议构建的可进行加密传输和身份认证的网络协议，比http协议的安全性更高。
区别：
Https协议需要ca证书，费用较高。
http是超文本传输协议，信息是明文传输，https则是具有安全性的ssl加密传输协议。
使用不同的链接方式，端口也不同，一般而言，http协议的端口为80，https的端口为443
http的连接很简单，是无状态的；HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议，比http协议安全。

文章写到这里就结束了，本文主要讲解了前端面试中常见的面试题，如对找工作有需求的小伙伴儿可以在牛客上看更多的大厂的面经，这里给小伙伴儿们附上连接😉😉😉（点击注册牛客账号），有需要的小伙伴可以注册哦~

写在最后

CSDN话题挑战赛第1期

• 活动详情地址：https://marketing.csdn.net/p/bb5081d88a77db8d6ef45bb7b6ef3d7f