1、display:none和visibility：hidden的区别？

display:none 隐藏不占位
visibility：hidden：会占位

2、移动端300ms延迟问题，用哪个css属性可解决？

touch-action：none

3、css中sprite是什么？有什么优缺点？

css中sprite是指图片精灵，将网站上用到的图片放在一张图片上，然通过移位显示对应的图标。
这样做的好处就是减少请求的次数。
缺点就是需要精细化的制作图片，控制要精确的控制，维护也是比较麻烦。

4、用非flex布局实现一个不定宽高容器元素内容水平垂直居中？

答：基本实现思路，使用单元格的特性来实现，垂直居中使用vertical-align:center; 水平居中text-align:center;里面的元素display:inline-block; 

参考代码如下（如需要写代码可以不用说）：
    .container{
        background-color: pink;
        height: 400px;
        width: 500px;
        display: table-cell;
        vertical-align: middle;
        text-align: center;
    }
    .box{
         background-color: cadetblue;
         width: 100px;
         height: 100px;
         display: inline-block;
    }

5、写出一个最简单的深复制方法？（可非定义函数）

var obj =[{a:1,b:2}]
var newObj = JSON.parse(JSON.stringify(obj))

6、写一个去重简单方法？（不限ES5、ES6）

var array=[1,1,2,2,3,3];
var newArray=Array.from( new Set(array));

7、var a=1,b=2;用非变量方式调换变量值（不限ES5、ES6）

var a=1,b=2;
[a,b]=[b,a]

8、写出一个给列表绑定事件的业务方法？（性能考虑）

这个题意不是很清楚，可以使用JQ吗？还是Vue.js?
function bindLi(ulSelector,eventName,callBack){
     //这里采用事件委托的方式，防止新增的li没有事件
     $(ulSelector).on(eventName,'li',function(e){
          if(callBack){
                 callBack(e);
         }
	 })
}

9、说一下对前端优化的方式

这个问题对于想拿10k以上的同学来讲必会
答：性能优化主要是围绕执行速度来做的。通常的做法是这样的
1.使用图片精灵，将多个图标放在一个图片上，然后通过背景图片定位来显示图标
2.有些图标使用使用阿里字体的，使用他们自带的云加速器下载字体文件
3.在首次加载的时候，将所需要的数据都放在一个接口上返回，减少请求的数量，经过测试这个效果还是挺明显的。
4.在编码上，我们通过会将this对象存储到临时变量，减少this查找的时间。
5.对于频繁使用的数据，会将数据缓存起来，减少多次请求接口。
6.使用压缩工具，对html、css、js文件，进行合并压缩处理，减少文件的体积。
7，对于数据较大的加载，通常采用分页加载或是按需加载或是延迟加载来处理。
这是我们比较常见的优化手段。