总结一下这几天遇到的面试题

1. css如何切换盒模型____。

   box-sizing: border-box / content-box;

2. 0.1 + 0.2 == 0.3_______。

   false

3. HTML5中js新增的选择器api__、____。

   document.querySelector()
   document.querySelectorAll()

4. HTML5新增的标签有哪些。

   <nav></nav>
   <vedio></vedio>
   <aside></aside>
   <header></header>
   <footer></footer>
   <canvas></canvas>
   <section></section>
   <article></article>

5. 写出让#move在wrapper正中央的所有方法。

   <div id="parent">
       <div id="move"></div>
   </div>

   ---

   1. flex布局
   #parent {
       displey: flex;
       justify-content: center;
       item-aligns: center;
   }
   2. table-cell布局
   #parent {
       display: table-cell;
       vertical-align: middle;
       text-align: center;
   }
   #move {
       display: inline-block;
   }
   3. position
   #parent {
       position: relative;
   }
   i.
   #move {
       position: absolute;
       top: 0;
       left: 0;
       bottom: 0;
       right: 0;
       margin: auto;
   }
   ii.
   #move {
       position: absolute;
       left: 50%;
       top: 50%;
       margin-top: -50px;
       margin-left: - 50px;
   }
   iii. 
   #move {
       position: absolute;
       left: 50%;
       top: 50%;
       transform: translate(-50%, -50%)
   }

6. 写出你所知道清除浮动的方式并说明优缺点。

   1. 额外标签法
   <div style="clear: both;"></div>
   缺点：影响代码质量，不符合标准

   2. 触发BFC实现清除浮动
   {
       overflow: hidden;
   }
   优点：代码简洁
   缺点：需要显示的内容会被隐藏

   3. 伪类清楚浮动
   .clearfix:after,
   .clearfix:before {
       content: "";
       display: block;
       height: 0;
       clear:both;
       visibility: hidden;
   }
   .clearfix {
       *zoom: 1; /*ie6清除浮动的方式 *号只有IE6-IE7执行
   }
   缺点：ie6-ie7不支持伪类
   优点：代码简洁，符合标准

7. 完成一下代码使程序能够正常输出。

   function test (_arr, _e) {
      ... 
   }
   
   var arr = [1,2,3,4,5]
   
   if (test(arr, 1) === 0 && test(arr, 6) === -1) {
       console.log('小没没')
   }

   ---

   function test (_arr, _e) {
       return _arr.indexOf(_e)
   }

8. js常见的数据类型。

   基本数据类型：Number、String、Boolean、undefined、null
   引用数据类型：Array、Object、Function、Date、RegExp

9. 写一个闭包的例子。

   function test () {
       var arr = []
       
       for (var i = 0; i < 10; i ++) {
           arr[i] = (function (i) {
               console.log(i)
           }(i))
       }
       
       return arr
   }
   
   var myArr = test()
   
   for (var j = 0; j < 10; j ++) {
       myArr[j]()
   }

10. 使用常见的方法给btn添加一个thisClick()事件

    <div id="btn"></div>

    var btn = document.getElementById('btn')
    
    1. btn.onclick = function () {
        thisClick()
    }
    
    2. btn.addEventlistener('click', thisClick, false)
    
    3. $('#btn').click(thisClick())
    
    4. $('#btn').on('click', thisClick)
    
    5. $('#btn').bind('click', thisClick)

11. vue生命周期。

    // 创建前状态
    beforeCreate () {
        
    }
    // 创建完毕状态
    created () {
        
    }
    // 挂载前状态
    beforeMount () {
        
    }
    // 挂载结束状态
    mounted () {
        
    }
    // 更新前状态
    beforeUpdate () {
        
    }
    // 更新完成状态
    updated () {
        
    }
    // 销毁前状态
    beforeDestroy () {
        
    }
    // 销毁完成状态
    destroy () {
        
    }