console.log()またはその他のログレベルコンソール出力関数を使用する場合、ログ出力には階層的な関係がありません。プログラムに多くのログ出力がある場合、この制限はかなりの問題を引き起こします。この問題を解決するために、console.group()を使用できます。次のコードは例です。
コードコピーは次のとおりです。
function dotask(){
Dosubtaska(1000);
Dosubtaska(100000);
console.log( "タスクステージ1が完了しました");
dosubtaskb(10000);
console.log( "タスクステージ2が完了しました");
dosubtaskc(1000,10000);
console.log( "タスクステージ3が完了しました");
}
function dosubtaska(count){
console.log( "Sub Sub Task A");
for(var i = 0; i <count; i ++){}
}
function dosubtaskb(count){
console.log( "サブタスクBの開始b");
for(var i = 0; i <count; i ++){}
}
function dosubtaskc(countx、郡){
console.log( "サブタスクCの開始C");
for(var i = 0; i <countx; i ++){
for(var j = 0; j <郡; j ++){}
}
}
dotask();
FireBugコンソールの出力は次のとおりです。
表示されたときに一定レベルの関係を持つべきログ出力の間に違いはないことがわかります。階層関係を追加するには、ログ出力をグループ化し、グループの開始時にconsole.group()を挿入し、グループの最後にconsole.groupend()を挿入できます。
コードコピーは次のとおりです。
function dotask(){
console.group( "タスクグループ");
Dosubtaska(1000);
Dosubtaska(100000);
console.log( "タスクステージ1が完了しました");
dosubtaskb(10000);
console.log( "タスクステージ2が完了しました");
dosubtaskc(1000,10000);
console.log( "タスクステージ3が完了しました");
console.groupend();
}
function dosubtaska(count){
console.group( "サブタスクAグループ");
console.log( "Sub Sub Task A");
for(var i = 0; i <count; i ++){}
console.groupend();
}
function dosubtaskb(count){
console.group( "サブタスクBグループ");
console.log( "サブタスクBの開始b");
for(var i = 0; i <count; i ++){}
console.groupend();
}
function dosubtaskc(countx、郡){
console.group( "サブタスクCグループ");
console.log( "サブタスクCの開始C");
for(var i = 0; i <countx; i ++){
for(var j = 0; j <郡; j ++){}
}
console.groupend();
}
dotask();
console.group()ステートメントを挿入した後、出力はFirebugコンソールになります。
ブラウザのサポート
console.group()は、console.log()と同様に、デバッグツールを備えたブラウザでよりよくサポートし、すべての主要なブラウザーがこの機能をサポートしています。