代码输出结果(function(){varx=y=1;})();varz;console.log(y);//1console.log(z);//undefinedconsole.log(x);//UncaughtReferenceError:xisnotdefined复制代码这段代码的关键是：varx=y=1;其实是从右往左执行的，首先Executey=1，因为y没有用var声明，所以是一个全局变量，然后第二步是把y赋值给x，也就是全局变量分配给局部变量。最后，x是局部变量，y是全局变量，所以打印x是错误的。前端高级面试题详解DNS协议是什么概念：DNS是DomainNameSystem（域名系统）的缩写，提供主机名到IP地址的转换服务，也就是我们常说的Domain名称系统。它是由层次化的DNS服务器组成的分布式数据库，是定义主机如何查询这个分布式数据库的应用层协议。它可以使人们更方便地上网，而不必记住机器可以直接读取的IP号码串。功能：将域名解析成IP地址，客户端向DNS服务器发送域名查询请求（DNS服务器有自己的IP地址），DNS服务器将Web服务器的IP地址告知客户端.什么是范围？ES5中只有两种作用域：全局作用域和函数作用域。在JavaScript中，我们将作用域定义为一组规则，用于管理引擎如何根据标识符名称在当前作用域和嵌套子作用域中搜索变量（变量名或函数名）。为什么0.1+0.2!=0.3，请详细说明原因，因为JS采用IEEE754双精度版本（64位），只要语言采用IEEE754，就存在这个问题。我们都知道计算机用二进制表示小数，所以0.1用二进制表示为//(0011)表示一个循环0.1=2^-4*1.10011(0011)复制代码那么如何得到这个二进制，我们可以计算十进制计算不同于二进制和整数。乘法时只计算小数位，整数位作为每一位的二进制，得到的第一位为最高位。于是我们得到0.1=2^-4*1.10011(0011)，那么0.2的计算基本如上所示，只需要去掉第一步的乘法，所以我们得到0.2=2^-3*1.10011(0011).回到IEEE754双精度。六十四位中，符号位占一位，整数位占十一位，其余五十二位均为小数位。因为0.1和0.2是无限循环的二进制，需要在小数点末尾判断是否进位（就像小数点四舍五入一样）。所以2^-4*1.10011...001在进位后变成2^-4*1.10011(0011*12次)010。然后将这两个二进制数相加得到2^-2*1.0011（0011*11次）0100，这个值计算为十进制0.300000000000000004先说一下原解，如下代码parseFloat((0.1+0.2).toFixed(10))复制代码对粘性定位的理解sticky英文字面意思是粘贴，所以可以称之为粘性定位。语法：位置：粘性；基于用户滚动位置的位置。粘性定位元素依赖于用户滚动，在position:relative和position:fixed定位之间切换。它的行为类似于position:relative;当页面滚动到目标区域之外时，它的行为类似于position:fixed;并固定在目标位置。元素定位表现为相对定位，直到超过某个阈值，然后固定定位。该特定阈值指的是顶部、右侧、底部或左侧之一。也就是说，指定top、right、bottom或left四个阈值之一，使粘性定位生效。否则它的行为与相对定位相同。src和href的区别src和href都是用来引用外部资源的，它们的区别如下：src：表示对资源的引用，它指向的内容会嵌入到当前标签的位置.src会把它指向的资源下载并应用到文档中，比如请求js脚本。浏览器在解析该元素时，会暂停其他资源的下载和处理，直到该资源加载、编译、执行完毕，所以一般js脚本都会放在页面底部。href：表示超文本引用，指向一些网络资源，与当前元素或本文档建立链接关系。当浏览器识别出它指向的文件时，它会在不停止处理当前文档的情况下并行下载资源。常用于a和link等标签。如何获取对象非原型链上的属性？使用hasOwnProperty()方法判断属性是否属于原型链的属性：functioniterate(obj){varres=[];for(obj中的varkey){if(obj.hasOwnProperty(key))res.push(key+':'+obj[key]);}returnres;}复制代码对媒体查询的理解？媒体查询由一个可选的媒体类型和零个或多个使用媒体特性（例如宽度、高度和颜色）的样式表范围的表达式组成。媒体查询，从CSS3加入，允许在不改变内容本身的情况下，为特定范围的输出设备裁剪内容的呈现，适合网页响应不同类型的设备并做出相应的适配。媒体查询包含一个可选的媒体类型，在满足CSS3规范的情况下，包含零个或多个描述媒体特性的表达式，最终将被解析为true或false。如果媒体查询中指定的媒体类型与用于显示文档的设备类型匹配，并且所有表达式的计算结果为真，则媒体查询的结果为真。然后媒体查询里面的样式就会生效。复制代码简单的说，使用@media查询可以定义不同媒体类型的样式。@media可以为不同的屏幕尺寸设置不同的样式，尤其是需要响应式设计的页面，@media非常好用。重置浏览器尺寸时，页面也会根据浏览器的宽高重新渲染页面。下面说说什么是跨域，以及如何解决。因为出于安全原因，浏览器具有同源策略。也就是说，如果跨域的协议、域名或端口不同，Ajax请求就会失败。为了防止CSRF攻击1.JSONPJSONP的原理很简单，就是利用了标签指向需要访问的地址，并提供回调函数，在需要通信时接收数据。JSONP很简单使用和兼容性都不错，但仅限于获取请求。2.CORSCORS需要浏览器和后端都支持。IE8和9需要通过XDomainRequest来实现。3.document.domain只有在二级域名相同的情况下才能使用该方法，例如a.test.com和b.test.com均适用该方法。只要在页面中添加document.domain='test.com'表示二级域名相同即可实现跨域4.webpack配置proxyTable设置开发环境跨域5.nginx代理跨域6.iframe跨域7.postMessagethis这个方法通常用于获取页面内嵌的第三方页面数据。一个页面发送消息，另一个页面确定来源并接收消息。复制代码WebSocket的理解WebSocket是HTML5提供的一种用于浏览器和服务器之间全双工通信的网络技术，属于应用层协议。它基于TCP传输协议，重用了HTTP握手通道。浏览器和服务器只需要完成一次握手，两者之间就可以直接建立持久连接，进行双向数据传输。WebSocket的出现解决了半双工通信的弊端。它最大的特点是服务端可以主动向客户端推送消息，客户端也可以主动向服务端推送消息。WebSocket原理：客户端通知（notify）一个事件（event），带有所有接收者ID（recipientsID）给WebSocket服务器，服务器收到后立即通知所有活跃（active）的客户端，接收者ID中只有IDsequence中的客户端会处理这个事件。WebSocket的特点如下：支持双向通信，实时性更强，可以发送文本，也可以发送二进制数据''基于TCP协议，服务端实现比较容易，数据格式比较轻，性能开销小，通信效率高。同源限制，客户端可以与任何服务器通信。协议标识为ws（加密后为wss），服务器URL为URL。对HTTP协议有很好的兼容性。默认的端口也是80和443，而且握手阶段使用的是HTTP协议，所以在握手的时候不容易屏蔽，可以通过各种HTTP代理服务器。Websocket的使用方法如下：在客户端：//在index.html中直接写WebSocket，设置服务端的端口号为9999letws=newWebSocket('ws://localhost:9999');//在客户端触发ws.onopen=function(){console.log("Connectionopen.");ws.send('hello');};//从服务器向客户端发送消息触发器ws.onmessage=function(res){console.log(res);//打印MessageEvent对象console.log(res.data);//打印收到的消息};//在客户端Triggerws.onclose=function(evt){console.log("Connectionclosed.");};复制代码如何防止事件冒泡普通浏览器使用：event.stopPropagation()IE浏览器使用：event.cancelBubble=true;代码输出结果vara=3;函数c(){警报(a);}(function(){vara=4;c();})();复制代码中的变量js函数的作用域链是在定义时与环境有关，与执行时无关。执行环境只会改变this，传递的参数，全局变量等，实现一个扇形。用CSS实现扇形的思路和三角形基本一致，就是增加圆角样式，实现90°的扇形：div{border:100pxsolidtransparent;宽度：0；身高：0；边框半径：100px；border-top-color:red;}复制代码点击刷新按钮或者按F5，按Ctrl+F5（强制刷新），在地址栏回车。？点击刷新按钮或者按F5：浏览器直接对本地缓存文件进行过期，但是会带上If-Modifed-Since，If-None-Match，表示服务器会检查文件的新鲜度，返回的结果可能是304，也可能是200。用户按下Ctrl+F5（强制刷新）：浏览器不仅会使本地文件过期，而且不会带上If-Modifed-Since，If-None-Match，也就是说它之前没有请求过，返回结果为200在地址栏输入：浏览器发起请求，按照正常流程，在本地检查是否过期，然后服务器检查新鲜度，最后返回内容.死锁的原因？如何解决死锁问题？所谓死锁，是指多个进程在运行过程中竞争资源造成的死锁。当进程处于这种死锁状态时，如果没有外力，它们将无法继续前进。系统中的资源可以分为两类：可剥夺资源，即某个进程获得此类资源后，该资源可以被其他进程或系统剥夺。CPU和主存都是可剥夺资源；不可剥夺资源，当系统将这类资源分配给一个进程后，不能再强行收回，只能在进程用完后释放，比如磁带机、打印机。死锁产生的原因：（1）竞争资源死锁中的其中一个竞争资源是指竞争不可剥夺的资源（例如：系统中只有一台打印机可供进程P1使用，假设P1已经占用了printer，如果P2继续要求打印机打印，就会阻塞）死锁中的竞争资源otherresource是指竞争的临时资源（临时资源包括硬件中断、信号、消息、缓冲区中的消息等）),消息通信通常顺序不当,会导致死锁(2)进程间非法推进顺序如果P1持有资源R1,P2持有资源R2,则系统处于不安全状态,因为如果两者进程向前推进，可能会出现死锁。比如P1运行到P1:Request(R2)时，会阻塞，因为R2已经被P2占用了；当P2运行到P2:Request(R1)时，也会阻塞，因为R1已经被P1占用，所以进程发生死锁产生死锁的必要条件：互斥条件：进程要求独占控制所分配的资源，即就是某个资源在一段时间内只被一个进程占用。请求和保持条件：当一个进程被请求资源阻塞时，保持它已经获得的资源。非剥夺条件：进程获得的资源在用完之前不能被剥夺，只有用完了才能自己释放。循环等待条件：当死锁发生时，必须有一个进程——一个循环的资源链。防止死锁的方法：一次性分配资源：一次分配所有资源，这样就不会再有请求（破坏请求条件）只要一个资源分配不上，就不会再分配其他资源给这个进程（销毁请保持条件）可剥夺资源：当一个进程获得了一些资源但不能获得其他资源时，释放占用的资源（打破不可剥夺条件）资源有序分配方式：系统为每种资源分配一个编号，每个进程按数字递增的顺序请求资源，释放则相反（打破循环等待状态）。一般如何生成闭包，返回一个函数function作为参数传递深/浅拷贝。首先判断数据类型是否为对象。如果是对象（数组|对象），则递归（深/浅拷贝），否则直接拷贝。functionisObject(obj){returntypeofobj==="object"&&obj!==null;}这个函数只能判断obj是不是对象，不能判断是数组还是对象。script标签中defer和async的区别如果没有defer或者async属性，浏览器会立即加载并执行相应的脚本。它不会等待后续加载的文档元素，读取到就开始加载执行，从而阻塞后续文档的加载。defer和async属性用于异步加载外部JS脚本文件，不会阻塞页面的解析。区别如下：执行顺序：多个带有async属性的标签不能保证加载顺序；多个具有defer属性的标签，标签按照加载顺序执行；脚本是否并行执行：async属性表示后续文档的加载和执行与js脚本的加载和执行是并行的，即异步执行；defer属性表示加载后续文档和js脚本的过程加载（此时只加载不执行）是并行（异步）进行的。js脚本需要等到document的所有元素都解析完后才执行，DOMContentLoaded事件触发执行前。cookie有哪些字段，它们的作用是什么？cookie由以下字段组成：Name：cookie的名称Value：cookie的值。对于身份验证cookie，该值包括Web服务器提供的访问令牌；访问此cookie的页面的路径。比如域名是abc.com，路径是/test，那么只有/test路径下的页面才能读取这个cookie。Secure：指定是否使用HTTPS安全协议发送cookie。使用HTTPS安全协议可以保护cookies在浏览器和web服务器之间传输过程中不被窃取和篡改。该方法还可以用于网站的身份认证，即在HTTPS连接建立阶段，浏览器会检查网站SSL证书的有效性。但基于兼容性原因（例如部分网站使用自签名证书），当检测到无效的SSL证书时，浏览器不会立即终止用户的连接请求，而是会显示安全风险信息，用户可以仍然选择继续访问该站点。地点。域：可以访问cookie的域名。cookie机制不遵循严格的同源策略，允许子域设置或获取其父域的cookie。cookie的上述特性在实现单点登录方案时非常有用，但同时也增加了cookie被攻击的风险，例如，攻击者可以借此发起会话固定攻击。因此，浏览器在Domain属性中禁止设置.org、.com、注册在国家和地区顶级域名下的二级域名，以减少攻击范围。HTTP：该字段包含HTTPOnly属性，用于设置cookie是否可以通过脚本访问。默认为空，即可以通过脚本访问。不能在客户端通过js代码设置一个httpOnly类型的cookie，这种类型的cookie只能通过服务端设置。该属性用于防止客户端脚本通过document.cookie属性访问cookie，这有助于保护cookie不被跨站脚本攻击窃取或篡改。但是，HTTPOnly的应用还是有局限性的。一些浏览器可以阻止客户端脚本读取cookie，但允许写入操作；此外，大多数浏览器仍然允许通过XMLHTTP对象读取HTTP响应中的Set-Cookie标头。Expires/Max-size：这个cookie的超时时间。如果该值被设置为一个时间，当到达该时间时cookie将失效。如果不设置，默认值为Session，也就是说cookie会和session一起失效。当浏览器关闭时（不是浏览器选项卡，而是整个浏览器），此cookie会过期。总结：服务端可以使用Set-Cookie响应头来配置cookie信息。一个cookie包括5个属性值expires、domain、path、secure、HttpOnly。其中expires指定了cookie的过期时间，domain为域名，path为路径，domain和path共同限定了cookie可以通过哪些url访问。secure规定cookie只有在保证安全的情况下才能传输，而HttpOnly规定cookie只能被服务端访问，不能被js脚本访问。
