控制台 API 參考資料

Sofia Emelianova
Sofia Emelianova

使用 Console API 從 JavaScript 將訊息寫入控制台。如需這個主題的互動式簡介,請參閱開始使用主控台記錄訊息

如需 debug(function)monitorEvents(node) 這類只能透過主控台提供的便利方法,請參閱 Console 公用程式 API 參考資料

console.assert(運算式, 物件)

記錄層級Error

expression 評估為 false 時,將 error 寫入主控台。

const x = 5;
const y = 3;
const reason = 'x is expected to be less than y';
console.assert(x < y, {x, y, reason});

上方 console.assert() 範例的結果。

console.clear()

清除控制台。

console.clear();

如果啟用「Preserve Log」,系統會停用 console.clear()

或者,您也可以按一下 ALT_TEXT_HERE 圖示來清除控制台

console.count([label])

記錄層級Info

以相同行,以相同的 label 寫入 count() 的叫用次數。如要重設計數,請呼叫 console.countReset([label])

console.count();
console.count('coffee');
console.count();
console.count();

上方 console.count() 範例的結果。

console.countReset([label])

重設計數。

console.countReset();
console.countReset('coffee');

console.createTask(name)

傳回 Task 例項,該例項將目前的堆疊追蹤與建立的 task 物件建立關聯。您稍後可以使用這個 task 物件執行函式 (以下範例為 f)。task.run(f) 會執行任意酬載,並將傳回值轉送至呼叫端。

// Task creation
const task = console.createTask(name);

// Task execution
task.run(f); // instead of f();

task 構成建立背景資訊與非同步函式內容之間的連結。這個連結可讓開發人員工具顯示更出色的非同步作業堆疊追蹤。詳情請參閱「連結的堆疊追蹤」。

console.debug(物件 [, 物件, ...])

記錄層級Verbose

console.log(object [, object, ...]) 相同,但記錄層級不同。

console.debug('debug');

上方 console.debug() 範例的結果。

console.dir(object)

記錄層級Info

列印指定物件的 JSON 表示法。

console.dir(document.head);

上方 console.dir() 範例的結果。

console.dirxml(node)

記錄層級Info

列印 node 子系的 XML 表示法。

console.dirxml(document);

上方 console.dirxml() 範例的結果。

console.error(object [, object, ...])

記錄層級Error

object 列印至控制台,將其格式化為錯誤,並包含堆疊追蹤。

console.error("I'm sorry, Dave. I'm afraid I can't do that.");

上方 console.error() 範例的結果。

console.group(label)

在呼叫 console.groupEnd(label) 前,以視覺化方式將訊息分組。在首次登入控制台時,使用 console.groupCollapsed(label) 收合群組。

const label = 'Adolescent Irradiated Espionage Tortoises';
console.group(label);
console.info('Leo');
console.info('Mike');
console.info('Don');
console.info('Raph');
console.groupEnd(label);

上方 console.group() 範例的結果。

此外,你也可以將群組建立巢狀結構。

const timeline1 = 'New York 2012';
const timeline2 = 'Camp Lehigh 1970';
console.group(timeline1);
console.info('Mind');
console.info('Time');
console.group(timeline2);
console.info('Space');
console.info('Extra Pym Particles');
console.groupEnd(timeline2);
console.groupEnd(timeline1);

巢狀群組。

console.groupCollapsed(label)

console.group(label) 相同,只是群組在登入控制台時一開始會收合。

console.groupEnd(label)

停止以視覺化方式分類郵件。請參閱「console.group」。

console.info(物件 [, 物件, ...])

記錄層級Info

console.log(object [, object, ...]) 相同。

console.info('info');

上方 console.info() 範例的結果。

console.log(物件 [, 物件, ...])

記錄層級Info

輸出訊息至控制台。

console.log('log');

上方 console.log() 範例的結果。

console.table(陣列 [, 資料欄])

記錄層級Info

將物件陣列記錄為資料表。

var people = [
  {
    first: 'René',
    last: 'Magritte',
  },
  {
    first: 'Chaim',
    last: 'Soutine',
    birthday: '18930113',
  },
  {
    first: 'Henri',
    last: 'Matisse',
  }
];
console.table(people);

上方 console.table() 範例的結果。

根據預設,console.table() 會記錄所有資料表資料。如要顯示單一資料欄或部分資料欄,您可以使用第二個選用參數,並以字串或字串陣列的形式,指定資料欄名稱或名稱。例如:

console.table(people, ['last', 'birthday']);

透過 console.table() 記錄的資料表,當中的資料欄子集。

console.time([label])

啟動新的計時器。呼叫 console.timeEnd([label]) 即可停止計時器,並將經過時間輸出至主控台。

console.time();
for (var i = 0; i < 100000; i++) {
  let square = i ** 2;
}
console.timeEnd();

上方 console.time() 範例的結果。

console.timeEnd([label])

記錄層級Info

停止計時器。請參閱「console.time()」。

console.trace()

記錄層級Info

將堆疊追蹤列印至主控台。

const first = () => { second(); };
const second = () => { third(); };
const third = () => { fourth(); };
const fourth = () => { console.trace(); };
first();

上方 console.trace() 範例的結果。

console.warn(物件 [, 物件, ...])

記錄層級Warning

向主控台顯示警告。

console.warn('warn');

上方 console.warn() 範例的結果。