web前端面试知识点

一、H5 新特性

本地存储 webStorage websocket webworkers

新增地理位置等API

对css3的支持

canvas

多媒体标签

新增表单元素类型

结构标签：header nav article aside footer

表单标签：email url range date

媒体标签：video audio

……

二、css3 新特性

圆角：border-radius

阴影：box-shadow

背景渐变：https://developer.mozilla.org/zh-CN/docs/Web/Guide/CSS/Using_CSS_gradients

弹性盒布局：https://www.jianshu.com/p/5856c4ae91f2

过渡

动画

2D/3D转换

新增的属性和选择器

……

三、webstorage 和cookie的区别

1、容量：cookie 4k，webStorage 5M。

2、存储时长：localStorage 长期存储，sessionStorage 基于单次会话存储，cookie 必须设定存储时长。

3、和服务器交互：cookie信息会在和服务器做交互时 默认发送到服务端；webStorage 只会存储在本地。

四、实现响应式布局几种方式

1、原生代码 媒体查询：https://developer.mozilla.org/zh-CN/docs/Web/Guide/CSS/Media_queries

2、说明bootstrap等框架的应用。

五、jsonp原理

允许用户传递一个callback参数给服务端，然后服务端返回数据时会将这个callback参数作为函数名来包裹住JSON数据，这样客户端就可以随意定制自己的函数来自动处理返回数据了。

六、闭包

一个可以访问另一个函数中的变量的函数。当一个函数的返回值是另外一个函数，而返回的那个函数如果调用了其父函数内部的变量，且返回的这个函数在外部被执行就产生了闭包。

七、js的垃圾回收机制

基本的垃圾回收算法称为 “标记-清除” ，定期执行以下“垃圾回收”步骤:

垃圾回收器获取根并 “标记” (记住)它们。
然后它访问并“标记”所有来自它们的引用。
然后它访问标记的对象并标记它们的引用。所有被访问的对象都被记住，以便以后不再访问同一个对象两次。
以此类推，直到有未访问的引用(可以从根访问)为止。
除标记的对象外，所有对象都被删除。
参考：

https://segmentfault.com/a/1190000018605776
八、浏览器缓存机制

在 Header 内的字段用于控制缓存机制 老方法 Expires，记录的绝对值 新方法 Cache-Control 多了一堆选项，记录的时间是相对值 获取缓存检测缓存是否过期，如果没过期取缓存，优先从内存，其次硬盘，如果过期，则与服务器协商缓存是否仍然可用，如果不可用则获取，可用取缓存。

参考：

https://juejin.im/entry/5ad86c16f265da505a77dca4
九、js 本地对象、内置对象和宿主对象

本地对象包括如下内容：Object、Function、String、Array、Boolean、Number。

内置对象：Math。

宿主