Die Funktionen setTimeout und setInterval in ECMAScript

Im  ECMAScript  sind  setTimeout(func, time) und  setInterval(func,time) 2 so gleiche Funktionen. Sie werden die Zeit gesetzt um eine Aufgabe durchzuführen.In dieser Unterricht werde ich jede Funktion nacheinander.

1- setTimeout() function

Die Funktion  setTimeout(func, delay) setzt einen Milisekunden Zeitraum  'delay' , wenn der Zeitraum vergeht, wird die Funktion  func alleiniges Mal aufgeruft.
Achtung: 1 Sekunde = 1000 milisekunde.
Die Syntax:
setTimeout(func, delay)
  • func: Diese Funktion wird nach dem Milisekunde Zeitraum delay' aufgeruft.
  • delay: der Verspätung Zeitraum (in Milisekunde gerechnet)
Unter ist das ein einfaches Beispiel mit der Funktion  setTimeout(). Nach 3 Sekunden ab wenn der Benutzer auf die Button  "Show greeting" klickt, wird eine Begrüssung angezeigt werden
setTimeout-example.html
<!DOCTYPE html>
<html>
   <head>
      <title>setTimeout function</title>

      <script type="text/javascript">

         function greeting()  {

              alert("Hello Everyone!");
         }

         function startAction()  {

            setTimeout(greeting, 3000); // 3 seconds.
         }

      </script>

   </head>
   <body>
      <h2>setTimeout Function</h2>


      <button onclick="startAction()">Show greeting</button>

   </body>
</html>

 
Ein anderes Beispiel mit der Funktion  setTimeout(), Sie können das Beispiel àuf die Umwelt  NodeJS laufen:
setTimeout-example.js
console.log("3");
console.log("2");
console.log("1");
console.log("Call setTimeout!");

setTimeout( function() {
  console.log("Hello Everyone!");
}, 3000); // 3 seconds

console.log("End!");
 

clearTimeout()

Angenommen, Sie ruft die Funktion setTimeout() auf um die Durchführung einer Aufgabe zu timen. Während diese Aufgabe nicht durchzuführen beginnt, können Sie durch die Aufruf der Funktion clearTimeout()  diese Aufgabe absagen.
clearTimeout-example.html
<!DOCTYPE html>
<html>
   <head>
      <title>clearTimeout function</title>

      <script type="text/javascript">
         var myTask = null;

         function greeting()  {
              alert("Hello Everyone!");
              myTask = null;
         }

         function startAction()  {
            if(!myTask) {
               myTask = setTimeout(greeting, 3000); // 3 seconds.
            }
         }

         function cancelAction()  {
            if(myTask)  {
               clearTimeout(myTask);
               myTask = null;
            }
         }

      </script>

   </head>
   <body>
      <h2>setTimeout() &amp; clearTimeout() Function</h2>


      <button onclick="startAction()">Show greeting</button>

      <button onclick="cancelAction()">Cancel</button>

   </body>
</html>
 

2- Die Funktion setInterval()

Die Funktion  setInterval(func, delay) setzt einen Milisekunde Zeitraum  'delay'. Nach jeder  'delay' Milisekunde wird die Funktion  func wieder aufgeruft.
Die Syntax
setInterval(func, delay)
  • func: Diese Funktion wird nach jeden Milisekunde 'delay' Zeitraum geruft.
  • delay:der Verspätung Zeitraum (in Milisekunde)
Unter ist das ein einfaches Beispiel mit der Funktion  setInterval(). Nach 3 Sekunden ab wenn der Benutzer auf die Button  "Show greeting" klickt,wird eine Begrüssung anzeigen. Und sie wird nach 3 Sekunde anzeigen,..
setInterval-example.html
<!DOCTYPE html>
<html>
   <head>
      <title>setInterval function</title>

      <script type="text/javascript">

         function greeting()  {

              alert("Hello Everyone!");
         }

         function startAction()  {

              setInterval(greeting, 3000); // 3 seconds.
         }

      </script>

   </head>
   <body>
      <h2>setInterval Function</h2>


      <button onclick="startAction()">Show greeting</button>

   </body>
</html>

 
Ein anderes Beispiel mit der Funktion  setInterval() können Sie das Beispiel auf die Umwelt  NodeJS laufen:
setInterval-example.js
console.log("3");
console.log("2");
console.log("1");
console.log("Call setInterval!");

setInterval( function() {
   console.log("Hello Everyone!");
}, 3000); // 3 seconds

console.log("End!");
 

clearInterval()

Angenommen, Sie rufen die Funktion  setInterval() auf um für die Durchführung einer Aufgabe zu time. Sie können durch die Aufruf von der Funktion  clearInterval() diese Aufgabe absagen.

clearInterval-example.html
<!DOCTYPE html>
<html>
   <head>
      <title>clearInterval function</title>

      <script type="text/javascript">

         var myTask = null;

         function greeting()  {

              alert("Hello Everyone!");
         }

         function startAction()  {
              if(!myTask)  {
                  myTask = setInterval(greeting, 3000); // 3 seconds.
              }
         }

         function cancelAction()  {
              if(myTask) {
                 clearInterval(myTask);
                 myTask = null;
              }
         }

      </script>

   </head>
   <body>
      <h2>setInterval() &amp; clearInterval() Function</h2>


      <button onclick="startAction()">Show greeting</button>

      <button onclick="cancelAction()">Cancel</button>

   </body>
</html>