面经练习（八）

1.有关雪碧图及其性能

雪碧图对性能影响

CSS Sprite最大的好处就是节省请求数了，那么为什么节省请求数能快呢？每一次发出一个图片的http请求，除了单纯的下载该图片外，还要算进发送请求的时间，服务器端处理请求的时间和来回的网络延时（这个一般是大头），我们把这些额外耗时叫做request overhead。所以实际情况下，尤其是对于图标这样的小图片，这些overhead很可能远远超过超过文件本身下载的时间，比如下载1kb的图片只要30ms，但光网络延时就等待了100ms。把它们做进一张sprite sheet节省的主要就是这些额外耗时。

但是大图片不建议合并如果将大图片进行 sprite 处理，可能会适得其反，因为较大的图片对网络资源有一定的消耗，本来应该尽快显示的内容必须等到合并在一起的其他图片下载完才能显示，会导致打开页面时局部图片缺失。

建议将文件类型相同并且颜色重叠度高的图片进行合并，一方面可以尽量减少体积。另一方面，因为图片使用颜色限制（PNG-8 和 GIF 最多 256 色），太多的颜色可能导致图片失真；对于 JPG 类图片，也可能因为图片过大而压缩导致失真。

2.javascript严格模式

3.rem px em区别

px像素（Pixel）。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。
em是相对长度单位。相对于当前对象内文本的字体尺寸，没有的话去父元素找，可以继承
举个例子：
比如说当前容器font-size:16px;则1em就等于16px;
rem 是CSS3新增的一个相对单位（相对于根元素的）,使用方法就是

浏览器的默认字体是16px,那么1rem=16px以此类推计算12px=0.75rem，10px=0.625rem，2rem=32px；
这样使用很复杂。

4.vue-router实现原理

其实就是hash 和history模式
vue-router实现原理

5.引用类型运算符优先级问题

    let a = {n : 1};
    let b = a;
    a.x = a = {n: 2};


    console.log(a.x)
    console.log(b.x)

引用类型运算符优先级问题

6.引用类型考察

let a={m:10,n:30}
let b=a;
let c=b;
b.m=20;
let d={...b}//相当于Object.assign 第一层对象为深拷贝，再深为浅拷贝
c={n:40}//此时c的地址不再与a,b相同

console.log(a.m) //20
console.log(a===b) //true
console.log(a===c) //false
console.log(b===d) //false（...运算符第一层深拷贝，如果某项还是引用类型会互相影响）
console.log(b===c) //false

7.什么是事件模型

什么是事件模型

8.渐进增强和优雅降级

渐进增强和优雅降级

9.box-sizing的三个值

padding-box IE不支持

10.DOM节点类型

文档节点document
元素节点element
文本节点text
属性节点attribute
注释节点

11.COOKIE和SESSION有什么区别

COOKIE和SESSION有什么区别
cookie，session,token