函数防抖和节流

html和css代码：

<div class="box">1</div>

<style type="text/css">

            .box {

                width: 100px;

                height: 100px;

                background: orange;

                color: #fff;

                font-size: 30px;

                text-align: center;

                line-height: 100px;

                margin: 40px auto;

            }

        </style>

js代码：

var box = document.querySelector(".box");

        var num = parseInt(box.innerHTML);

        var boxTime1=null;

        var boxTime2=null;

        var bol=true;

        console.log(Date.now());

        每隔2秒执行一次（节流）：

        box.οnclick=function(){

            if(bol){

                bol=false;

                boxTime2 = setTimeout(function(){

                    num++;

                    box.innerHTML = num;

                    bol=true;

                },2000)

            }

        }

第一次触发(防抖)：

        box.οnclick=function(){

            clearTimeout(boxTime1);

            if(bol){

                num++;

                box.innerHTML = num;

                bol=false;

            }

            boxTime1 = setTimeout(function(){

                bol=true;

            },2000);

        }

   只触发最后一次：

        box.οnclick=function(){

            clearTimeout(boxTime1);

            boxTime1 = setTimeout(function(){

                console.log(111111111)

                num++;

                box.innerHTML = num;

            },2000);

        }