HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

HTML DOM console.time（）メソッド

HTML DOMのconsole.time（）メソッドは、コードの実行に経過した時間を表示するために使用されます。これは、コード全体またはコードの特定のビットを分析するのに役立ちます。コードのタイミングを調整することで、コードをより効率的にすることができます。オプションのlabelパラメータを使用すると、同じページに複数のタイマーを作成できます。

構文

以下は、HTML DOM console.time（）メソッドの構文です-

console.time(label)

ここで、ラベルはタイマーに名前を付けるためのオプションのパラメーターです。

例

console.time（）メソッドの例を見てみましょう-

<!DOCTYPE html>
<html>
<body>
<h1>console.time() Method</h1>
<p>Click the below button to time the for,while and do-while loops for 100000 iterations </p>
<button type="button" onclick="LoopPerform()">TIMER</button>
<script>
   var i,j,k;
   i=0,j=0,k=0;
   function LoopPerform(){
      console.time("for-loop");
      for (; i < 100000; i++){}
         console.timeEnd("for-loop");
      console.time("while-loop");
      while(j<100000)
         j++;
      console.timeEnd("while-loop");
      console.time("do-while loop");
      do{k++;}
      while(k<100000);
      console.timeEnd("do-while loop");
   }
</script>

Press F12 key to view the performance result in your console view
</body>
</html>

出力

これにより、次の出力が生成されます-

HTML DOM console.time（）メソッド

タイマーボタンをクリックすると-

HTML DOM console.time（）メソッド

上記の例では-

最初に、ユーザーがクリックしたときにLoopPerform（）関数を実行するボタンTIMERを作成しました-

<button type="button" onclick="LoopPerform()">TIMER</button>

LoopPerform（）関数には、for、while、do-whileループが内部で実行されています。 3つのループのパフォーマンスを測定するために作成された、「for-loop」、「while-loop」、「do-whileloop」というラベルの付いた合計3つのタイマーがあります。

console.time（）メソッドはタイマーを開始し、オプションのラベルパラメーターを受け取り、その中のコードが実行されている間に経過した時間をカウントします。実行中のコードは、console.time（）およびconsole.timeEnd（）メソッド内に保持されます。コードの実行が完了するまでにかかった時間がコンソールウィンドウに表示されます-

function LoopPerform(){
   console.time("for-loop");
   for (; i < 100000; i++){}
      console.timeEnd("for-loop");
   console.time("while-loop");
   while(j<100000)
      j++;
   console.timeEnd("while-loop");
   console.time("do-while loop");
   do{k++;}
   while(k<100000);
   console.timeEnd("do-while loop");
}

  1. HTML DOM console.groupEnd（）メソッド

    HTML DOM console.groupEnd（）メソッドは、メッセージグループの終わりを示すために使用されます。コンソールの現在のメッセージグループを終了します。 構文 Follwingは、console.groupEnd（）メソッドの構文です- console.groupEnd() 例 HTML DOM console.groupEnd（）メソッドの例を見てみましょう- <!DOCTYPE html> <html> <body> <h1>console.groupEnd() Method</h1> <p>Pre

  2. HTML DOM console.groupCollapsed（）メソッド

    HTML DOM console.groupCollapsed（）メソッドは、折りたたまれたメッセージグループの開始を指定します。 構文 以下は構文です- console.groupCollapsed(label) ここで、labelはグループのラベルです。 例 console.groupCollapsed（）メソッドの例を見てみましょう- <!DOCTYPE html> <html> <body> <h1>console.groupCollapsed() Method</h1> <p>Press F12 key t