自我介绍
说说你对闭包的理解
使用闭包主要是为了设计私有的方法和变量。闭包的优点是可以避免全局变量的污染,缺点是闭包会常驻内存,会增大内存使用量,使用不当很容易造成内存泄露。在js中,函数即闭包,只有函数才会产生作用域的概念
闭包有三个特性:
1.函数嵌套函数
2.函数内部可以引用外部的参数和变量
3.参数和变量不会被F垃圾回收机制回收url加载到页面渲染的过程
重绘:
当元素的一部分属性发生改变,如外观、背景、颜色等不会引起布局变化,只需要浏览器根据元素的新属性重新绘制,使元素呈现新的外观叫做重绘。
回流
:当render树中的一部分或者全部因为大小边距等问题发生改变而需要DOM树重新计算的过程
重绘不一定需要回流(比如颜色的改变),回流必然导致重绘(比如改变网页位置)
引起重排(回流reflow)的场景和属性
- 添加、删除可见的dom
- 元素的位置改变
- 元素的尺寸改变(外边距、内边距、边框厚度、宽高、等几何属性)
- 页面渲染初始化
- 浏览器窗口大小改变
- 页面渲染css和dom的过程
- 浏览器解析html源码,然后创建一个 DOM树。并行请求 css/image/js在DOM树中,每一个HTML标签都有一个对应的节点,并且每一个文本也都会有一个对应的文本节点。DOM树的根节点就是 documentElement,对应的是html标签。
- 浏览器解析CSS代码,计算出最终的样式数据。构建CSSOM树。对CSS代码中非法的语法它会直接忽略掉。解析CSS的时候会按照如下顺序来定义优先级:浏览器默认设置 < 用户设置 < 外链样式 < 内联样式 < html中的style。
- DOM Tree + CSSOM –> 渲染树(rendering tree)。渲染树和DOM树有点像,但是是有区别的。
DOM树完全和html标签一一对应,但是渲染树会忽略掉不需要渲染的元素,比如head、display:none的元素等。而且一大段文本中的每一个行在渲染树中都是独立的一个节点。渲染树中的每一个节点都存储有对应的css属性。 - 一旦渲染树创建好了,浏览器就可以根据渲染树直接把页面绘制到屏幕上。
以上四个步骤并不是一次性顺序完成的。如果DOM或者CSSOM被修改,以上过程会被重复执行。实际上,CSS和JavaScript往往会多次修改DOM或者CSSOM。
前端页面处理缓存的方法(手动删除,头文件禁止)
什么情况下能够使页面渲染加载变快(答js文件后移,css文件用链接的方式)
一、减少HTTP请求
五、将样式表放在头部
首先说明一下,将样式表放在头部对于实际页面加载的时间并不能造成太大影响,但是这会减少页面首屏出现的时间,使页面内容逐步呈现,改善用户体验,防止“白屏”。
六、将脚本放在底部
js的下载和执行会阻塞Dom树的构建(严谨地说是中断了Dom树的更新),所以script标签放在首屏范围内的HTML代码段里会截断首屏的内容。
7. 有什么方法可以延迟js文件的挂载
8. Vue的生命周期
9. vue父组件和子组件生命周期的执行顺序
10. vue钩子函数的用法
11. 什么时候触发vue的update(答watch和compute)
- https了解吗,和http有什么区别
HTTPS和HTTP的区别主要如下:
1、https协议需要到ca申请证书,一般免费证书较少,因而需要一定费用。
2、http是超文本传输协议,信息是明文传输,https则是具有安全性的ssl加密传输协议。
3、http和https使用的是完全不同的连接方式,用的端口也不一样,前者是80,后者是443。
4、http的连接很简单,是无状态的;HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议,比http协议安全。
13. https的加密方式,公钥和私钥的管理,证书
14. http注入有什么(答有sql的注入),怎么处理(后端减少插值处理)
- Http2.0有了解过吗
多路复用
上面提到HTTP/1.1的线头阻塞和多个TCP连接的问题,HTTP2的多路复用完美解决。HTTP2让所有的通信都在一个TCP连接上完成,真正实现了请求的并发。我们来看一下HTTP2具体是怎么实现的:
头部压缩
头部压缩也是HTTP2的一大亮点。在1.X版本中,首部用文本格式传输,通常会给每个传输增加500-800字节的开销。现在打开一个网页上百个请求已是常态,而每个请求带的一些首部字段都是相同的,例如cookie、user-agent等。HTTP2为此采用HPACK压缩格式来压缩首部。头部压缩需要在浏览器和服务器端之间:
维护一份相同的静态字典,包含常见的头部名称,以及常见的头部名称和值的组合
维护一份相同的动态字典,可以动态的添加内容
通过静态Huffman编码对传输的首部字段进行编码
服务器端推送
服务器端推送使得服务器可以预测客户端需要的资源,主动推送到客户端。
客户端了解到服务器端打算推送哪些资源,就不会再为这些资源创建重复请求。当客户端收到index.html的响应时,script.js和style.css已经位于缓存。
16. 如何处理表单提交过程中因为网络问题多次点击的事件(用防抖和节流的思想回答了下,不会)
17. js防抖与节流了解吗,怎么实现?(手写防抖代码,太难了)
- 项目中用了webSocket,怎么实现的,有什么优点
前端和后端的交互模式最常见的就是前端发数据请求,从后端拿到数据后展示到页面中。如果前端不做操作,后端不能主动向前端推送数据,这也是http协议的缺陷。
因此,一种新的通信协议应运而生---websocket,他最大的特点就是服务端可以主动向客户端推送消息,客户端也可以主动向服务端发送消息,实现了真正的平等。
推送功能
支持服务器端向客户端推送功能。服务器可以直接发送数据而不用等待客户端的请求。
没有同源限制,客户端可以与任意服务器通信。
减少通信量,更主动
被动性,当服务器完成协议升级后(HTTP->Websocket),服务端就可以主动推送信息给客户端啦。解决了上面同步有延迟的问题。 只要建立起websocket连接,就一直保持连接,在此期间可以源源不断的传送消息,直到关闭请求。也就避免了HTTP的非状态性。和http相比,不但每次连接时的总开销减少了,而且websocket的首部信息量也小 ,通信量也减少了。
19. 除了webSocket,有了解其他的即时通信框架吗(不会)
20. css问题:如何实现两栏布局?
21. Tcp和udp,简单说一下,什么时候用udp
22. 算法题:分层电费计价(函数拓展不行)
23. 算法题:字符串数组最长的前缀