一、超时调用setTimeout()

setTimeout() 办法用于在指定的毫秒数后调用函数或计算表达式。

setTimeout(coda/function,milliseconds,param1, param2, ...)
code/function必须。要调用一个代码串，也能够是一个函数。
milliseconds可选。执行或调用 code/function 须要期待的工夫，以毫秒计。默认为 0。
param1, param2, ...可选。 传给执行函数的其余参数（IE9 及其更早版本不反对该参数）。
    <button onclick="myset()">点一点变色</button>    <p id="p">1:4:9彩色石碑</p>    <script>        var p=document.getElementById('p');        function myset(){            setTimeout(()=>{                p.style.color='red';            },3000)        //三秒后字体变红        };    </script>

clearTimeout()用于勾销超时调用

  <button onclick="myset()">点一点变色</button>   <!--先点击-->    <button onclick="qx()">点击勾销</button>       <!--3秒内点击便可勾销变色-->    <p id="p">1:4:9彩色石碑</p>    <script>        var p=document.getElementById('p');        var my;        function myset(){            my=setTimeout(()=>{                p.style.color='red';            },3000)        };        function qx(){            clearTimeout(my);  //勾销超时调用        }    </script>

二、间歇调用setInterval()

setInterval() 办法可依照指定的周期（以毫秒计）来调用函数或计算表达式。

setInterval() 办法会不停地调用函数，直到 clearInterval() 被调用或窗口被敞开

setInterval(coda/function,milliseconds,param1, param2, ...)
code/function必须。要调用一个代码串，也能够是一个函数。
milliseconds必须。周期性执行或调用 code/function 之间的工夫距离，以毫秒计。
param1, param2, ...可选。 传给执行函数的其余参数（IE9 及其更早版本不反对该参数）。
  <button onclick="zz()">点击自增</button>    <p id="p">1</p>    <script>        var p=document.getElementById('p');        var i=1;        function zz() {            res=setInterval(zt,1000)        }                       //每隔1秒p标签外面的数字会如2，3，4，5，6……这般实现自增        function zt(){            i++;            p.innerText=i;        }    </script>

clearInterval()用于勾销超时调用

    <button onclick="zz()">点击自增</button>       <!-- 点击自增 -->    <button onclick="qx()">勾销自增</button>    <!-- 自增后点击勾销自增 -->    <p id="p">1</p>    <script>        var p=document.getElementById('p');        var i=1;        function zz() {            res=setInterval(zt,1000)        }        function zt(){            i++;            p.innerText=i;        }        function qx(){            clearInterval(res);     //勾销间歇调用        }    </script>

三、this指向

超时函数的代码都是在全局作用域中执行的，因而函数的this值在非严格模式下指向window对象，在严格模式下是undefined。
   //setTimeout()和setInterval()   <script>        var name = '全局'        var obj = {            name: '部分',            bb: function () {                setTimeout('console.log(this.name)', 3000)  //指向全局                setInterval('console.log(this.name)', 1000)    //指向全局            },            cc: function () {                console.log(this.name);            }        }        obj.bb();  //全局        obj.cc();  //部分    </script>

四、超时调用setTimeout()在满足肯定条件后就能够主动进行，不须要应用clearTimeout()。因而，倡议应用setTimeout()代替setInterval()去做一些操作，例如

    <p id="p">10</p>    <script>        var p =document.getElementById('p');        var s=10;        function my(){               s--;            p.innerText=s;            if(s>1){                setTimeout(my,2000)            }else{                p.innerText=s;            }        }        my();    </script>