前端面试题

最新推荐文章于 2021-09-26 15:50:30 发布

qq_43708577

最新推荐文章于 2021-09-26 15:50:30 发布

阅读量121

点赞数

分类专栏： web基础部分

本文链接：https://blog.csdn.net/qq_43708577/article/details/85226833

版权

web基础部分专栏收录该内容

37 篇文章 0 订阅

订阅专栏

用户输入网址请求相应的流程（最有技术含量的一道面试题）

1 用户打开浏览器
2 地址栏输入我们需要访问的网站网址
3 浏览器通过DNS服务器获取即将访问的网站的IP地址
4浏览器发起一个对这个IP的请求
5根据请求的url对应的文件类型判断是否为静态文件，如果请求的是一个静态文件的话，直接读取这个文件的内容，然后将文件内容返回给客户端

6如果请求的不是一个静态文件的话，就读取文件中的代码然后执行这段代码(交给其他程序执行),然后再将执行结果得到的字符串返回给客户端。

js动画和css动画实现的区别

1 js实现动画是一个帧动画，就是使用定时器，每隔一段时间更改当前元素的状态
2 css3 是补间动画，就是过渡(加过渡只要状态改变产出动画)、动画(多个节点来控制动画)性能会更好
3 在支持H5C3的浏览器可能使用css动画(移动端开发)
4 transition animation
5 transition 组合写法(trabsution:all is linear ls)

0.0/24最有多少个可用的IP地址

1 https和http性能的区别
2请问一下的HTTP状态码是什么意思 403？
3OS17层模型下，哪些7层协议在4层是基于UDP协议的？
4请简述什么情况会发生：TIME_WAIT
5平衡树的插入和删除的时间复杂度分别是？
6 快速排序的思路？
7给数组排序的方法有哪些.请举例
8请简述希尔排序的过程
9二叉树中序遍历是从哪儿开始?
10关闭页面后sessionStorage还能存活多久？
11 Coolie依赖Session存在吗？他俩又什么关系
12 locationStorage和sessionStorage的最大区别是什么？
13请简单举出一种响应式布局的方法
14常用的行内元素有哪些？
15 如何实现右边宽度固定，左边自适应
16flex布局和传统布局有什么区别
17事件委托主要解决了什么问题？在原生的JS中一个列表有很很多li，如何委托li点击事件？
18 在ajax请求中，请求类型jsonp/json的请求返回格式是什么？
19HTML中有没有什么事件不支持冒泡？
20你一般怎么判断基本是的数据类型？
25jsonp可以解决跨名跨域的问题，说法是否正确
26 Array/set的区别是什么？
27 WeakMap的map函数有什么作用
28Vue数据双向绑定的原理是什么？
29 简述Vue中一个Component生命周期
30 一个前端转件需要掌握哪些东西
31 简述前端性能优化都需要注意什么？
32 简述微信扫一扫二维码网页上登录前后端过程？
33 js原型继承
34请写出几个你熟悉的DNS服务器地址
35http状态码400？
36HTTP通信协议中的304是怎么产生的？
37平衡二叉树和二叉树的区别
38快排和冒泡这两种排序方法各有什么样的优缺点
39单链表和双链表的区别
40CSRF是什么.攻击原理，怎么预防？
41 一般现代浏览器可以并行下载多少个资源
42 1rem等于多少px?
43 同一个对象上绑定了多个事件委托，执行的先后次序是怎么样的？
44一般来说时间复杂度是怎么推测的？
45简述希尔排序的过程？
46二叉树主要是用来解决什么问题的？
47 flex布局和其他布局有什么区别？
48在ajax请求中，get和post的区别是什么？
49 在ES6中，如何动态导入js代码实现按需引用？
50 简述Vuex整个触发过程？
51 写出一个匹配手机号码的正则表达式
52 CSS中常见的reset作用是？
53请简单举出一种响应式布局的方法
54 队列和栈有什么区别
55一般浏览器可以并行下载多少个资源？
56 闭包主要面向什么场景，解决什么问题
57ES6中如何深拷贝一个数组
58ES6中，箭头函数和普通函数的区别？
59 说说你知道的设计模式，并且在前端的应用？
60 null和undefined有什么区别？
61 ES6中，let和const的区别是什么？

https和http性能的区别

HTTP 协议传输的数据都是未加密的，也是明文的，因此使用HTTP协议传输隐私信息是非常不安全的，为了保证这些隐私数据能加密传输，于是网景公司设计了一个SSL协议用于对HTTP协议传输的数据进行加密，从而就诞生了HTTPS，简单的说，HTTPS协议是由SSL+HTTP协议构建的可进行加密传输明身份认证的网络协议，要比HTTP协议安全

HTTP和HTTPS的区别主要如下：
1 https协议需要到ca申请证书，一般免费证书较少，因此需要一定费用
2 http是超文本传输协议，信息是明文传输，http则是具有安全性的ssl加密传输协议
3 https的端口是443
4 http的端口是80
5http的链接是很简单的，是无状态的，HTTPS协议室友SSL+HTTP协议构建的可进行加密传输，身份认证的网络协议，比http协议安全

HTTPS的工作原理

1客户使用https的URL访问Web服务器，要求与Web服务器建立SSL连接
2 Web服务器收到客户端请求后，会将网站的证书信息（证书中包含公钥）传送一份给客户端
3客户端的浏览器与Web服务器开始协商SSL连接的安全等级，也就是信息加密的等级
4客户端的浏览器根据双方同意的安全等级，建立会话密钥，然后利用网站的公钥将会话密钥加密，并传送给网站。
5 Web服务器利用自己的私钥解密出会话密钥。
6 Web服务器利用会话密钥加密与客户端之间的通信

请问一下的HTTP状态码是什么意思 403？

403 状态码就是，拒绝或者禁止访问，403返回码的含义是“Forbidden”

请简述什么情况会发生：TIME_WAIT

1 为实现TCP全双工连接的可靠释放
2 为使旧的数据包在网络因过期而消失

平衡树的插入和删除的时间复杂度分别是？

快速排序的思路？

1 先从数列中取出一个数作为基准数
2区分过程中，将比这个数大的数全放在他的右边，小于或等于他的数全放在左边
3 再对左右区间重复第二步，知道各区间只有一个数

SessionStorage会话存储

sessionStorage 是HTML5新增的一个会话存储对象，用于临时保存同一窗口（或标签页）的数据，在关闭窗口或标签之后将会删除这些数据，在JavaScript语言中可通过window.sessionStorage 或sessionStorage调用此对象

同源策略

1 什么是同源？
   URL由协议，域名，端口和路径组成，如果两个URL协议，域名，端口相同，则表示他们同源，相反，协议，域名，端口有任何一个不同，就被当做是跨域
   http：//localhost：63342/simpleApp/app/index.html#/
   http：//协议
   localhost：域名
   63342：端口
   simpleApp/app/index.html#：路径
   
2 跨域
跨域是指从一个域的网页去请求另一个域的资源

3 解决跨域的方法
   1JSONP 
       概念：JSONP就是利用《script》标准的跨域能力实现跨域数据访问的。通常为了减轻web服务器的负载，我们把js,css,img等静态资源分离到另一台独立域名的服务器上，在HTML页面中再通过相应的标签从不同域名下加载静态资源，而被浏览器允许基于此原理我们可以通过创建script，再请求一个带参网址实现跨域通信
        <script>
    var script = document.createElement('script');
    script.type = 'text/javascript';

    // 传参并指定回调执行函数为onBack
    script.src = 'http://www.domain2.com:8080/login?user=admin&callback=onBack';
    document.head.appendChild(script);

    // 回调执行函数
    function onBack(res) {
        alert(JSON.stringify(res));
    }
 </script>
       缺点：JSONP只支持GET请求
 

  2 CORS（跨域资源共享）
     是HTML5的一项特性，他定义了一种浏览器和服务器交互的方式来确定是否允许跨域请求

    ```

## 跨域解决方案
1 通过jsonp
2 postmessage跨域
3 CORS跨域资源共享
4 nginx代理跨域
5 WebSocket协议跨域