说说面试中的一些坑

自从换了公司，这几年一直忙着招人。面试的时候，时不时挖个坑，看看别人会不会跳进去。。。好久没写文章了，顺便总结一下经验吧。。。我也不清楚如果我能写完，我能写多少。当然文章仅代表个人观点，觉得不对也没关系。1.GET和POST请求有什么区别？这是一个普遍的问题。有些文章说POST比GET安全，说实话，确实是扯淡。GET有长度限制，也是受浏览器本身的限制。还有一种说法是GET不能传body，所以我用express跑了个小服务。constexpress=require('express')constapp=express()app.use(require('express-body'))/*测试入口*/app.use('/test',(req,res)=>{res.send('这里是测试页面')})/*interface*/app.use('*',(req,res)=>{res.send(req.body)})app.listen('3000',()=>{console.log('expressstart')})然后我尝试在chrome中获取varmyHeaders=newHeaders();myHeaders.append("Content-Type","application/json");var原始=JSON。stringify({"hello":"world"});varrequestOptions={method:'GET',headers:myHeaders,body:raw,redirect:'follow'};fetch("localhost:3000",requestOptions).then(response=>response.text()).then(result=>console.log(result)).catch(error=>console.log('error',错误));果然，浏览器抛给我一个Theexception说GETorHEADrequestscannothaveabody。然后我用xhrvardata=JSON.stringify({"hello":"world"});varxhr=newXMLHttpRequest();xhr.withCredentials=true;xhr.addEventListener("readystatechange",function(){if(this.readyState===4){console.log(this.responseText);}});xhr.open("GET","http://localhost:3000/");xhr.setRequestHeader("内容-类型","应用程序/json");xhr.发送（数据）；没想到请求发送了，返回的结果却是一个空的json。看了请求内容，确实没有body的影子，好像是在chrome中这个说法确实得到了验证，但是真的是这样吗？然后我用postman向服务发送了一个带body的GET请求，请求成功返回了我传过来的body信息，于是我又尝试用curl下curl--location--requestGET'localhost:3000'\--header'Content-Type:application/json'\--data-raw'{"hello":"world"}'也成功了，那这又是怎么回事呢？它可能与同源策略和浏览器的方言相同吗？于是搜索了一下，大概是在ToUseGet看到下面的说明的时候找到了下面的信息。我的英语不是很好。请自行翻译。按照惯例，当使用GET方法时，识别资源所需的所有信息都编码在URI中。HTTP/1.1中没有关于客户端在HTTP实体bo中向服务器提供数据的安全交互（例如，检索）的约定dy而不是在URI的查询部分。这意味着为了安全操作，URI可能会很长。安全操作的大参数的情况并没有直接由HTTP解决，因为它目前已部署。已经讨论了QUERY或“安全POST”或“GETwithBODY”方法（例如，在1996年12月的IETF会议上），但尚未达成共识。然后StackOverflow有这样一个问题HTTPGETwithrequestbody。GET请求消息中的负载没有定义的语义；在GET请求上发送有效负载主体可能会导致某些现有实现拒绝该请求。对GET请求的响应是可缓存的；缓存可以使用它来满足后续的GET和HEAD请求，除非Cache-Control标头字段（[[RFC7234]的第5.2节]（https://tools.ietf.org/html/r...这么说吧，浏览器其实是遵守HTTP规范的，但是其他客户端也可以忽略这个规范，就算你通过了，你也可以通过也可以不通过。当然，协议建议你不要通过。。。如果你传过去，就不能保证幂等，不能等，就是说缓存没有意义。2.HTTP缓存在各种中文资料里经常说，协商缓存和强缓存我就不多说了。无法再验证来源。可能是为了方便大家了解缓存的特点。协议中没有这样的声明。给一个复杂的特征一个容易记住的名词是一种常见的做法，但它被传递了。还以为有这回事，然后看了看no-cache和no-store。这是no-cache的说明。“no-cache”响应指令指示响应不得用于满足未在源服务器上成功验证的后续请求。这允许源服务器阻止缓存使用它来满足请求而不联系它，即使缓存已配置为发送陈旧的响应。需要通过服务器验证来判断当前资源是否可以使用。“no-store”响应指令指示缓存不得存储即时请求或响应的任何部分。该指令适用于私有和共享缓存。“不得存储”在此上下文中意味着缓存不得有意将信息存储在非易失性存储中，并且必须尽最大努力在转发信息后尽快从易失性存储中删除信息。这意味着如果你不想使用缓存，你可以使用这个。所以一个误区是如果不想使用缓存，应该在Cache-Control3中使用no-store。在标签中挂上no-cache可以防止缓存页面吗？你应该总是使用各种文章中看到的，如何防止当前网页被缓存，最简单粗暴的方法是添加于是我按照上面的说明在本地挂了一个页面，然后愉快的返回了with第二次访问304，完全没有效果。仔细想想，HTTP协议是否使用缓存是通过请求头来判断的。在到达body层之前，会判断是否使用缓存。此外，服务器还需要知道你发送的是html文本，然后分析里面有没有这样的meta标签，里面一定有对应的字段。如果是动态的jsp页面，你觉得这层拦截是在apache还是nginx中做的？做？那么就可以证明这个东西是无效的？作为一个严谨的程序员，我肯定不能这么快就得出这个结论。虽然你在网上抄袭各种文章，但很多东西并不是空穴来风。于是去w3查了很多资料，找到了一些适合我的：在metaHTML3.2里面，然后继续回头看，众所周知，w3c在2019年放弃了发布html和dom标准，whatwg变成了占主导地位的家庭。我转过头继续看WHATWG——whatwg中的元元素。然后跑去看WHATWG-MetaExtensions。好家伙，唯一和缓存有关的东西，根本实现不了。所以我们大概有一些结论，这个东西不靠谱，挂了也不行。http该做的事情，还是由http来做。4、说到localStorage和sessionStorage，大家通常都会说到localStorage和sessionStorage的体积。一般最多只能使用5MB，但实际情况真的是这样吗？因为懒，就去一个小网站测试一下存储。存储在chrome下确实是5MB左右，后来改成了苹果自带的。浏览器safari的结果是localStorage只有5兆，sessionStorage超过10兆。浏览器之间的差异一下子就出来了。这个和上面说的5兆没有关系，但是5兆肯定不是空穴来风，所以又跑到w3看了协议说明W3:WebStorageUseragentsshouldlimitthetotalamountofspaceallowedforstorageareas，因为恶意作者可能会使用此功能耗尽用户的可用磁盘空间。用户代理应该防止网站存储他们的数据或在ig下的其他附属网站，例如在a1.example.com、a2.example.com、a3.example.com等中存储到限制，绕过主要的example.com存储限制。用户代理可能会在达到配额时提示用户，允许用户授予站点更多空间。例如，这使站点能够在用户的计算机上存储许多用户创建的文档。用户代理应该允许用户查看每个域使用了多少空间。建议将每个来源的5MB限制在大多数情况下是任意的。欢迎实施反馈，并将用于在futu中更新此建议re.为了可预测性，配额应基于存储的未压缩数据的大小。上面大致写了下面的意思，为了防止一些别有用心的开发者耗尽你电脑上的磁盘空间，所以本地存储的资源量，但是通过更改域名还是可以存储更多数据的。建议每个源5兆左右。还有一个建议……也就是说，做大做小，客户自己想办法，只要你觉得合理，就可以有5个G，普通的Set和Map能干什么？大家应该说是用来对数组进行去重的，但是如果数组是[{name:1},{name:2},{name:3},{name:1}]这种情况下，我们就挖两个这时候给面试官的坑。使用Map的duck式识别解决问题constdata=[{name:1},{name:2},{name:3},{name:1}]constmaps=newMap()data.forEach((item)=>{maps.set(item.name,item)})constresult=[...maps].map((item)=>item[1])从表面上看，它确实解决了与字面量，但是一旦这个对象中有额外的值，上面提到的方法肯定有问题，第二个坑就是Set本身就是一个指针的问题consta={name:1}constb={name:2}constc=Array.from(newSet([a,a,b,a]))我们执行这个操作后，只会出现[{name:1},{name:2}]的结果，所以不是对象引起的，而是对象的指针引起的。所以如果我们能解决指针问题，也许这个问题就可以解决了，