1、http和https 待定
说一下http和https_前端校招面试题目合集_牛客网 (nowcoder.com)
2、从发送请求到页面展现，都经过了哪些
3、TCP和UDP的区别 ！！待定
参考回答:
（1）TCP是面向连接的，udp是无连接的即发送数据前不需要先建立链接。
（2）TCP提供可靠的服务。也就是说，通过TCP连接传送的数据，无差错，不丢失，不重复，且按序到达;UDP尽最大努力交付，即不保证可靠交付。 并且因为tcp可靠，面向连接，不会丢失数据因此适合大数据量的交换。
（3）TCP是面向字节流，UDP面向报文，并且网络出现拥塞不会使得发送速率降低（因此会出现丢包，对实时的应用比如IP电话和视频会议等）。
（4）TCP只能是1对1的，UDP支持1对1,1对多。
（5）TCP的首部较大为20字节，而UDP只有8字节。
（6）TCP是面向连接的可靠性传输，而UDP是不可靠的。
4、WebSocket的实现和应用 待定，需要深入
5、一个图片url访问后直接下载怎样实现？
参考回答：
请求的返回头里面，用于浏览器解析的重要参数就是OSS的API文档里面的返回http头，决定用户下载行为的参数。
下载的情况下：
- x-oss-object-type:Normal
- x-oss-request-id:598D5ED34F29D01FE2925F41
- x-oss-storage-class:Standard
6、几个很实用的BOM属性对象方法?
几个很实用的BOM属性对象方法?前端校招面试题目合集牛客网 (nowcoder.com)
7、HTML5 drag
参考回答：
dragstart：事件主体是被拖放元素，在开始拖放被拖放元素时触发，。
darg：事件主体是被拖放元素，在正在拖放被拖放元素时触发。
dragenter：事件主体是目标元素，在被拖放元素进入某元素时触发。
dragover：事件主体是目标元素，在被拖放在某元素内移动时触发。
dragleave：事件主体是目标元素，在被拖放元素移出目标元素是触发。
drop：事件主体是目标元素，在目标元素完全接受被拖放元素时触发。
dragend：事件主体是被拖放元素，在整个拖放操作结束时触发
8、说一下http2.0和 htttp3.0 （这个可能不对，需要查证）
说一下http2.0_前端校招面试题目合集_牛客网 (nowcoder.com)
9、fetch发送2次请求的原因
参考回答：
fetch发送post请求的时候，总是发送2次，第一次状态码是204，第二次才成功？
原因很简单，因为你用fetch的post请求的时候，导致fetch 第一次发送了一个Options请求，询问服务器是否支持修改的请求头，如果服务器支持，则在第二次中发送真正的请求。
10、Cookie、sessionStorage、localStorage的区别
应该已经谢过了
11、说一下web worker
参考回答：
在HTML页面中，如果在执行脚本时，页面的状态是不可相应的，直到脚本执行完成后，页面才变成可相应。web worker是运行在后台的js，独立于其他脚本，不会影响页面你的性能。并且通过postMessage将结果回传到主线程。这样在进行复杂操作的时候，就不会阻塞主线程了。
如何创建web worker：
检测浏览器对于web worker的支持性
创建web worker文件（js，回传函数等）
创建web worker对象
12、HTML5标签语义化的好处
好像也写过了
13、iframe是什么？有什么缺点？
参考回答：
定义：iframe元素会创建包含另一个文档的内联框架
提示：可以将提示文字放在之间，来提示某些不支持iframe的浏览器
缺点：
会阻塞主页面的onload事件
搜索引擎无法解读这种页面，不利于SEO
iframe和主页面共享连接池，而浏览器对相同区域有限制所以会影响性能。
14、你了解的网络安全都有哪些？如何抵御（自己找）
XSS。等
15、cookie和session的区别 （自己查）
16、讲讲viewport和移动端布局
响应式布局的常用解决方案对比(媒体查询、百分比、rem和vw/vh）
17、http常用请求头 （背诵）
http常用请求头前端校招面试题目合集牛客网 (nowcoder.com)
18、强缓存和协商缓存都是什么 （自己查）
参考：强缓存、协商缓存什么时候用哪个前端校招面试题目合集牛客网 (nowcoder.com)
19、get和post的区别
get参数通过url传递，post放在request body中。
get请求在url中传递的参数是有长度限制的，而post没有。
get比post更不安全，因为参数直接暴露在url中，所以不能用来传递敏感信息。
get请求只能进行url编码，而post支持多种编码方式
get请求会浏览器主动cache，而post支持多种编码方式。
get请求参数会被完整保留在浏览历史记录里，而post中的参数不会被保留。
GET和POST本质上就是TCP链接，并无差别。但是由于HTTP的规定和浏览器/服务器的限制，导致他们在应用过程中体现出一些不同。
GET产生一个TCP数据包；POST产生两个TCP数据包。
20、在地址栏里输入一个URL,到这个页面呈现出来，中间会发生什么？
（直接看公众号）
21、画一条0.5px的线 （自己搜）为什么这个会是一个问题
22、transition和animation的区别
Animation和transition大部分属性是相同的，他们都是随时间改变元素的属性值，他们的主要区别是transition需要触发一个事件才能改变属性，而animation不需要触发任何事件的情况下才会随时间改变属性值，并且transition为2帧，从from .... to，而animation可以一帧一帧的。
23、flex布局 （全背）
24、BFC是什么
25、垂直居中的方法，水平居中的方法。（自己搜，经典题目）
垂直居中的方法前端校招面试题目合集牛客网 (nowcoder.com)
26、 css动画和js动画有什么区别
渲染线程分为main thread和compositor thread，如果css动画只改变transform和opacity，这时整个CSS动画得以在compositor trhead完成（而js动画则会在main thread执行，然后出发compositor thread进行下一步操作），特别注意的是如果改变transform和opacity是不会layout或者paint的。
区别：
功能涵盖面，js比css大
实现/重构难度不一，CSS3比js更加简单，性能跳优方向固定
对帧速表现不好的低版本浏览器，css3可以做到自然降级
css动画有天然事件支持
css3有兼容性问题
27、文本溢出省略号（自己查）
28、position属性
fixed \ relative \ absolute \ sticky \ static \ inherit
29、CSS选择器，优先级
30、三栏布局的实现方式，尽可能多写，浮动布局时，三个div的生成顺序有没有影响
三栏布局的实现方式，尽可能多写，浮动布局时，三个div的生成顺序有没有影响前端校招面试题目合集牛客网 (nowcoder.com)
31、用css实现一个硬币旋转的效果
用css实现一个硬币旋转的效果前端校招面试题目合集牛客网 (nowcoder.com)
32、了解重绘和重排吗，知道怎么去减少重绘和重排吗，让文档脱离文档流有哪些方法
DOM的变化影响到了预算内宿的几何属性比如宽高，浏览器重新计算元素的几何属性，其他元素的几何属性也会受到影响，浏览器需要重新构造渲染书，这个过程称之为重排，浏览器将受到影响的部分重新绘制在屏幕上 的过程称为重绘，引起重排重绘的原因有：
添加或者删除可见的DOM元素，
元素尺寸位置的改变
浏览器页面初始化，
浏览器窗口大小发生改变，重排一定导致重绘，重绘不一定导致重排，
减少重绘重排的方法有：
不在布局信息改变时做DOM查询，
使用csstext,className一次性改变属性
使用fragment
对于多次重排的元素，比如说动画。使用绝对定位脱离文档流，使其不影响其他元素
33、CSS画基础形状，正方形，圆形，椭圆等等
34、前端事件流
参考回答：
HTML中与javascript交互是通过事件驱动来实现的，例如鼠标点击事件onclick、页面的滚动事件onscroll等等，可以向文档或者文档中的元素添加事件侦听器来预订事件。想要知道这些事件是在什么时候进行调用的，就需要了解一下“事件流”的概念。
什么是事件流：事件流描述的是从页面中接收事件的顺序,DOM2级事件流包括下面几个阶段。
事件捕获阶段
处于目标阶段
事件冒泡阶段
addEventListener：addEventListener 是DOM2 级事件新增的指定事件处理程序的操作，这个方法接收3个参数：要处理的事件名、作为事件处理程序的函数和一个布尔值。最后这个布尔值参数如果是true，表示在捕获阶段调用事件处理程序；如果是false，表示在冒泡阶段调用事件处理程序。
IE只支持事件冒泡。
35、说一下事件委托
事件委托指的是，不在事件的发生地（直接dom）上设置监听函数，而是在其父元素上设置监听函数，通过事件冒泡，父元素可以监听到子元素上事件的触发，通过判断事件发生元素DOM的类型，来做出不同的响应。
举例：最经典的就是ul和li标签的事件监听，比如我们在添加事件时候，采用事件委托机制，不会在li标签上直接添加，而是在ul父元素上添加。
好处：比较合适动态元素的绑定，新添加的子元素也会有监听函数，也可以有事件触发机制。
36、说一下图片的懒加载和预加载
参考回答：
预加载：提前加载图片，当用户需要查看时可直接从本地缓存中渲染。
懒加载：懒加载的主要目的是作为服务器前端的优化，减少请求数或延迟请求数。
两种技术的本质：两者的行为是相反的，一个是提前加载，一个是迟缓甚至不加载。
懒加载对服务器前端有一定的缓解压力作用，预加载则会增加服务器前端压力。
37、bind，apply，call的区别
38、手写bind，apply，call
39、异步加载js的方法
参考回答：
defer：只支持IE如果您的脚本不会改变文档的内容，可将 defer 属性加入到