web前端面试试题整理

最新推荐文章于 2024-11-20 17:49:32 发布

huakaiwuxing

最新推荐文章于 2024-11-20 17:49:32 发布

阅读量243

点赞数 2

本文链接：https://blog.youkuaiyun.com/huakaiwuxing/article/details/96481739

版权

近来根据我所了解到的同事或朋友面试所被问到的问题做了一个整理，其中很多我依旧欠缺，先把问题整理出来，后续答案陆续加上，知道答案或者已有自己见解的小可爱们欢迎留言，共同学习。

1.vue路由的跳转原理

2.合并数组

3.http的3次握手和4次挥手

http的三次握手和四次挥手：

浏览器在给服，务器传输数据之前，有三次握手，握手成功之后，才可以传输数据

1、浏览器需要先发送SYN码，客户端请求和服务器建立连接；

2、服务器接收到SYN码，再发送给客户端SYN+ACK码，我可以建立连接；

3、客户端接收到ACK码，验证这个ACK是否正确，如果正确则客户端和服务端则建立起数据连接；双方的数据发送通道都将开启；

 

四次挥手：

1、当客户端无数据要传输了，会发送FIN码告诉服务器，我发送完毕了；

2、当服务端接收完毕后，告诉客户端ACK码，告诉客户端你可以把数据通道关闭了；

3、当服务器发送完毕之后，也会发送FIN码，告诉浏览器，数据发送完毕；

4、当客户端接收完毕 之后，同样发送ACK码，告诉服务器，数据接收完毕，你可以关闭；

 三次握手和四次挥手的好处：确保数据的安全和完整

4.h5的本地存储

关于这个问题，可能不止一种答案，我的工作中有用过localstorage来进行不同页面的数据传递与接收

  //b页面赋值
  var storage = window.localStorage;
  storage.setItem('giftId',giftid);
  storage.setItem('giftNum',giftnum);


//a页面获取
//全局变量
  var storage = window.localStorage;
  var gifid = storage.getItem('giftId');
  var giftnum=storage.getItem("giftNum");

5.跨域的实现（jsonp、cors（跨域资源共享）、反向代理Nginx） *****

跨域请求的解决都离不开服务端；
1.jsonp需要目标服务器配合一个callback函数；

其实jsonp解决跨域的原理就是依靠scrpit标签的src不受同源策略的约束来跨域获取数据的


jsonp解决跨域的方法也可以理解为将数据封装起来，伪装成其他的静态资源来供浏览器解析，并且只能使用get请求，所以当传输的数据量较大的时候这个方法是不适用的

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JSONP实现跨域2</title>
</head>
<body>
    <div id="mydiv">
        <button id="btn">点击</button>
    </div>
</body>
<script type="text/javascript">
    function handleResponse(response){
            console.log(response);
    }
</script>
<script type="text/javascript">
    window.onload = function() {

    var oBtn = document.getElementById('btn');

    oBtn.onclick = function() {     

        var script = document.createElement("script");
        script.src = "https://api.douban.com/v2/book/search?q=javascript&count=1&callback=handleResponse";
        document.body.insertBefore(script, document.body.firstChild);   
    };
};
</script>
</html>

2.cors   跨域资源共享，它需要服务器设置header：Access-Control-Allow-Origin

6.echarts

7.鼠标拖拽

8.axios、await、async

9.双向数据绑定原理，底层代码的实现（自己封装）***

10.v-model怎么实现的？不用框架，自己写实现呢？

11.vuex的工作原理是什么？

12.react-router的工作原理是什么？

13.vue-router

14.重排重绘

15.虚拟dom怎么工作的？

16.手写设计模式，手写继承

17.没有代码提示工具的情况下自己写一个功能js

18.vue的生命周期*****