From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/ja/web/api/console/assert/index.html | 102 +++++++ files/ja/web/api/console/clear/index.html | 44 ++++ files/ja/web/api/console/count/index.html | 106 ++++++++ files/ja/web/api/console/countreset/index.html | 104 ++++++++ files/ja/web/api/console/debug/index.html | 68 +++++ files/ja/web/api/console/dir/index.html | 67 +++++ files/ja/web/api/console/dirxml/index.html | 119 +++++++++ files/ja/web/api/console/error/index.html | 77 ++++++ files/ja/web/api/console/group/index.html | 86 ++++++ files/ja/web/api/console/groupcollapsed/index.html | 128 +++++++++ files/ja/web/api/console/groupend/index.html | 120 +++++++++ files/ja/web/api/console/index.html | 292 +++++++++++++++++++++ files/ja/web/api/console/info/index.html | 66 +++++ files/ja/web/api/console/log/index.html | 101 +++++++ files/ja/web/api/console/profile/index.html | 126 +++++++++ files/ja/web/api/console/profileend/index.html | 130 +++++++++ files/ja/web/api/console/table/index.html | 208 +++++++++++++++ files/ja/web/api/console/time/index.html | 66 +++++ files/ja/web/api/console/timeend/index.html | 129 +++++++++ files/ja/web/api/console/timestamp/index.html | 125 +++++++++ files/ja/web/api/console/trace/index.html | 86 ++++++ files/ja/web/api/console/warn/index.html | 147 +++++++++++ 22 files changed, 2497 insertions(+) create mode 100644 files/ja/web/api/console/assert/index.html create mode 100644 files/ja/web/api/console/clear/index.html create mode 100644 files/ja/web/api/console/count/index.html create mode 100644 files/ja/web/api/console/countreset/index.html create mode 100644 files/ja/web/api/console/debug/index.html create mode 100644 files/ja/web/api/console/dir/index.html create mode 100644 files/ja/web/api/console/dirxml/index.html create mode 100644 files/ja/web/api/console/error/index.html create mode 100644 files/ja/web/api/console/group/index.html create mode 100644 files/ja/web/api/console/groupcollapsed/index.html create mode 100644 files/ja/web/api/console/groupend/index.html create mode 100644 files/ja/web/api/console/index.html create mode 100644 files/ja/web/api/console/info/index.html create mode 100644 files/ja/web/api/console/log/index.html create mode 100644 files/ja/web/api/console/profile/index.html create mode 100644 files/ja/web/api/console/profileend/index.html create mode 100644 files/ja/web/api/console/table/index.html create mode 100644 files/ja/web/api/console/time/index.html create mode 100644 files/ja/web/api/console/timeend/index.html create mode 100644 files/ja/web/api/console/timestamp/index.html create mode 100644 files/ja/web/api/console/trace/index.html create mode 100644 files/ja/web/api/console/warn/index.html (limited to 'files/ja/web/api/console') diff --git a/files/ja/web/api/console/assert/index.html b/files/ja/web/api/console/assert/index.html new file mode 100644 index 0000000000..eb8b92bbf7 --- /dev/null +++ b/files/ja/web/api/console/assert/index.html @@ -0,0 +1,102 @@ +--- +title: Console.assert() +slug: Web/API/console/assert +tags: + - API + - DOM + - Debugging + - Method + - NeedsBrowserCompatibility + - Web Development + - console + - web console +translation_of: Web/API/console/assert +--- +
{{APIRef("Console API")}}
+ +

console.assert() は、アサーションが false になる場合に、コンソールへエラーメッセージを出力します。アサーションが true になる場合は、何も行いません。

+ +

{{AvailableInWorkers}}

+ +

構文

+ +
console.assert(assertion, obj1 [, obj2, ..., objN]);
+console.assert(assertion, msg [, subst1, ..., substN]); // C ライクなメッセージ形式
+
+ +

引数

+ +
+
assertion
+
任意のブール式。アサーションが false になると、コンソールにメッセージを出力します。
+
obj1 ... objN
+
出力する JavaScript オブジェクトのリスト。各オブジェクトを文字列で表現したものを、リストの並び順に追記して出力します。
+
msg
+
0 個以上の置換文字列を含む JavaScript 文字列。
+
subst1 ... substN
+
msg 内の置換文字列を置き換える JavaScript オブジェクト。このパラメータで、出力形式を高度に制御できます。
+
+ +

Examples

+ +

下のコード例はオブジェクトをconsole.assert()に渡す場合を示しています。

+ +
const errorMsg = 'the # is not even';
+for (let number = 2; number <= 5; number += 1) {
+    console.log('the # is ' + number);
+    console.assert(number % 2 === 0, {number: number, errorMsg: errorMsg});
+    // ES2015 object property shorthand を使った版
+    // console.assert(number % 2 === 0, {number, errorMsg});
+}
+// 出力:
+// the # is 2
+// the # is 3
+// Assertion failed: {number: 3, errorMsg: "the # is not even"}
+// the # is 4
+// the # is 5
+// Assertion failed: {number: 5, errorMsg: "the # is not even"}
+
+ +

置換文字列を含む文字列は、Node.jsや、大多数のブラウザではconsole.logのパラメータとして動作することに注意してください

+ +
console.log('the word is %s', 'foo');
+// 出力: the word is foo
+
+ +

このような文字列の使用は、現在のところ、すべてのブラウザでconsole.assertのパラメータとして意図した通りには動作するわけではありません。

+ +
console.assert(false, 'the word is %s', 'foo');
+// correct output in Node.js and some browsers
+//     (e.g. Firefox v60.0.2):
+// Assertion failed: the word is foo
+// incorrect output in some browsers
+//     (e.g. Chrome v67.0.3396.87):
+// Assertion failed: the word is %s foo
+
+ +

詳しくは {{domxref("console")}} のドキュメントで、コンソールにテキストを出力する をご覧ください。

+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Console API", "#assert", "console.assert()")}}{{Spec2("Console API")}}最初期の定義
+ +

ブラウザ実装状況

+ + + +

{{Compat("api.Console.assert")}}

diff --git a/files/ja/web/api/console/clear/index.html b/files/ja/web/api/console/clear/index.html new file mode 100644 index 0000000000..1e43a57ed1 --- /dev/null +++ b/files/ja/web/api/console/clear/index.html @@ -0,0 +1,44 @@ +--- +title: clear() +slug: Web/API/console/clear +tags: + - API + - Debugging + - Method + - Reference + - console + - web console +translation_of: Web/API/Console/clear +--- +
{{APIRef("Console API")}}
+ +

console.clear()は実行環境が許可する場合、コンソールをクリアします。

+ +

構文

+ +
console.clear();
+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Console API", "#clear", "console.clear()")}}{{Spec2("Console API")}}最初期の定義
+ +

ブラウザ実装状況

+ + + +

{{Compat("api.Console.clear")}}

diff --git a/files/ja/web/api/console/count/index.html b/files/ja/web/api/console/count/index.html new file mode 100644 index 0000000000..d0c7659d14 --- /dev/null +++ b/files/ja/web/api/console/count/index.html @@ -0,0 +1,106 @@ +--- +title: Console.count() +slug: Web/API/console/count +tags: + - API + - DOM + - Debugging + - Method + - NeedsBrowserCompatibility + - Web Development + - web console +translation_of: Web/API/Console/count +--- +
{{APIRef("Console API")}}
+ +

console.count() はcount() を個々に呼び出した回数を記録します。

+ +

{{AvailableInWorkers}}

+ +

構文

+ +
console.count([label]);
+ +

引数

+ +
+
label {{Optional_Inline}}
+
{{jsxref("String")}}。label を与えると、この関数は特定のラベルを伴って count() を呼び出した回数を記録します。label を省略すると、この関数はdefaultというラベルを伴って count() を呼び出したかのように振る舞います
+
+ +

Examples

+ +

例えば、以下のコードについて考えます:

+ +
let user = "";
+
+function greet() {
+  console.count();
+  return "hi " + user;
+}
+
+user = "bob";
+greet();
+user = "alice";
+greet();
+greet();
+console.count();
+ +

コンソールの出力は、以下のようになります:

+ +
"default: 1"
+"default: 2"
+"default: 3"
+"default: 4"
+ +

特にラベルが指定されなかったので表示されているラベルは default となっています。

+ +

始めの count() で引数 label に変数 user を、また 2 番目の count() で文字列 "alice" を与えました:

+ +
let user = "";
+
+function greet() {
+  console.count(user);
+  return "hi " + user;
+}
+
+user = "bob";
+greet();
+user = "alice";
+greet();
+greet();
+console.count("alice");
+ +

すると、以下のように出力されます:

+ +
"bob: 1"
+"alice: 1"
+"alice: 2"
+"alice: 3"
+ +

label の値のみに基づいて、個々の呼び出し回数を管理しています。

+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Console API", "#count", "console.count()")}}{{Spec2("Console API")}}最初期の定義
+ +

ブラウザ実装状況

+ + + +

{{Compat("api.Console.count")}}

diff --git a/files/ja/web/api/console/countreset/index.html b/files/ja/web/api/console/countreset/index.html new file mode 100644 index 0000000000..0981b0b446 --- /dev/null +++ b/files/ja/web/api/console/countreset/index.html @@ -0,0 +1,104 @@ +--- +title: Console.countReset() +slug: Web/API/console/countReset +translation_of: Web/API/Console/countReset +--- +
{{APIRef("Console API")}}
+ +

console.countReset() は{{domxref("console.count()")}}で使われたカウンターをリセットします。

+ +

{{AvailableInWorkers}}

+ +

Syntax

+ +
console.countReset([label]);
+
+ +

Parameters

+ +
+
label {{optional_inline}}
+
{{jsxref("String")}}。labelを与えるとcountReset()はlabelに対応するカウンターを0にリセットします。labelを省略するとcountReset()はdefaultのカウンターを0にリセットします。
+
+ +

Examples

+ +

例えば、以下のコードについて考えます:

+ +
let user = "";
+
+function greet() {
+  console.count();
+  return "hi " + user;
+}
+
+user = "bob";
+greet();
+user = "alice";
+greet();
+greet();
+console.count();
+console.countReset();
+ +

コンソールの出力は、以下のようになります:

+ +
"default: 1"
+"default: 2"
+"default: 3"
+"default: 4"
+"default: 0"
+
+ +

console.counterReset()の呼び出しによってdefaultのカウンターが0になったことに注意してください。

+ +

始めの count() で引数 label に変数 user を、また 2 番目の count() で文字列 "alice" を与えました:

+ +
let user = "";
+
+function greet() {
+  console.count(user);
+  return "hi " + user;
+}
+
+user = "bob";
+greet();
+user = "alice";
+greet();
+greet();
+console.countReset("bob");
+console.count("alice");
+ +

すると、以下のように出力されます:

+ +
"bob: 1"
+"alice: 1"
+"alice: 2"
+"bob: 0"
+"alice: 3"
+ +

bobのカウンターをリセットしたとき他のカウンターに影響を与えません。aliceのカウンターが変更されていないことがわかります。

+ +

仕様

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName("Console API", "#count", "console.countReset()")}}{{Spec2("Console API")}}Initial definition
+ +

ブラウザ実装状況

+ + + +

{{Compat("api.Console.countReset")}}

diff --git a/files/ja/web/api/console/debug/index.html b/files/ja/web/api/console/debug/index.html new file mode 100644 index 0000000000..6a3169189b --- /dev/null +++ b/files/ja/web/api/console/debug/index.html @@ -0,0 +1,68 @@ +--- +title: Console.debug() +slug: Web/API/console/debug +tags: + - API + - Debug + - console + - log + - デバッグ + - プリント + - メソッド + - リファレンス + - ロギング + - 出力 + - 開発者ツール +translation_of: Web/API/Console/debug +--- +
{{APIRef("Console API")}}
+ +

{{domxref("Console")}} の debug() メソッドは、"debug" ログレベルで Web コンソールにメッセージを出力します。このメッセージは、デバッグ出力を表示するようにコンソールが構成されている場合にのみユーザに表示されます。

+ +

{{AvailableInWorkers}}

+ +

構文

+ +
console.debug(obj1 [, obj2, ..., objN]);
+console.debug(msg [, subst1, ..., substN]);
+
+ +

パラメータ

+ +
+
obj1 ... objN
+
出力する JavaScript オブジェクトのリスト。これらの各オブジェクトの文字列表現は、リストされた順に追加され、コンソールに出力されます。
+
msg
+
連続した順序で subst1 から substN に置き換えられる 0 個以上の置換文字列を含む JavaScript 文字列。
+
subst1 ... substN
+
msg 内の置換文字列を置換する JavaScript オブジェクト。これにより、出力の形式をさらに制御できます。置換のしくみの説明については、{{SectionOnPage("/ja/docs/Web/API/Console", "文字列置換を使用する")}} を参照してください。
+
+ +

詳細については、{{domxref("console")}} オブジェクトのドキュメントの コンソールにテキストを出力する を参照してください。

+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書ステータスコメント
{{SpecName("Console API", "#debug", "console.debug()")}}{{Spec2("Console API")}}初期定義
+ +

ブラウザの互換性

+ +
+ + +

{{Compat("api.Console.debug")}}

+
diff --git a/files/ja/web/api/console/dir/index.html b/files/ja/web/api/console/dir/index.html new file mode 100644 index 0000000000..52a83ea921 --- /dev/null +++ b/files/ja/web/api/console/dir/index.html @@ -0,0 +1,67 @@ +--- +title: Console.dir() +slug: Web/API/Console/dir +tags: + - API + - DOM + - Debugging + - Method + - Reference + - Web Development + - console + - web console +translation_of: Web/API/Console/dir +--- +

{{APIRef("Console API")}}

+ +

{{domxref("Console")}} の dir() メソッドは、指定された JavaScript オブジェクトのプロパティの対話的なリストを表示します。出力は折り畳み式の階層的なリストで表示され、子オブジェクトの中身を見ることができます。

+ +

言い換えれば console.dir() は指定された JavaScript オブジェクトのプロパティをすべてコンソール上で見る方法であり、開発者は簡単にオブジェクトのプロパティを得ることができます。

+ +

{{AvailableInWorkers}}

+ +

console-dir.png

+ +

構文

+ +
console.dir(object);
+
+ +

引数

+ +
+
object
+
プロパティを出力する JavaScript オブジェクトです。
+
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("Console API", "#dir", "console.dir()")}}{{Spec2("Console API")}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Console.dir")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/console/dirxml/index.html b/files/ja/web/api/console/dirxml/index.html new file mode 100644 index 0000000000..1ee3d5b7fe --- /dev/null +++ b/files/ja/web/api/console/dirxml/index.html @@ -0,0 +1,119 @@ +--- +title: Console.dirxml() +slug: Web/API/console/dirxml +tags: + - API + - DOM + - Debugging + - Method + - NeedsBrowserCompatibility + - Web Development + - web console +translation_of: Web/API/Console/dirxml +--- +
{{APIRef("Console API")}}{{Non-standard_header}}
+ +

指定した XML/HTML 要素の子孫要素の対話式ツリーを表示します。または、ツリーを表示できない場合は JavaScript オブジェクトのビューを表示します。これは子ノードの内容を確認可能な、展開式の階層型ノードリストとして出力します。

+ +

構文

+ +
console.dirxml(object);
+
+ +

引数

+ +
+
object
+
出力対象の JavaScript オブジェクト
+
+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Console API", "#consoledirxmlobject", "console.dirxml()")}}{{Spec2("Console API")}}最初期の定義
+ +

ブラウザ実装状況

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本サポート{{CompatVersionUnknown}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}
Worker で使用可能{{CompatUnknown}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本サポート{{CompatUnknown}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Worker で使用可能{{CompatUnknown}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

関連情報

+ + diff --git a/files/ja/web/api/console/error/index.html b/files/ja/web/api/console/error/index.html new file mode 100644 index 0000000000..5655e1e99a --- /dev/null +++ b/files/ja/web/api/console/error/index.html @@ -0,0 +1,77 @@ +--- +title: Console.error() +slug: Web/API/Console/error +tags: + - API + - DOM + - Debugging + - Method + - Web Development + - web console +translation_of: Web/API/Console/error +--- +
{{APIRef("Console API")}}
+ +

デバッガの Web コンソールにエラーメッセージを出力します。

+ +

{{AvailableInWorkers}}

+ +

構文

+ +
console.error(obj1 [, obj2, ..., objN]);
+console.error(msg [, subst1, ..., substN]);
+console.exception(obj1 [, obj2, ..., objN]);
+console.exception(msg [, subst1, ..., substN]);
+
+ +
+

補足: console.exception() は、console.error() の別名です。これらは機能的に同じものです。

+
+ +

引数

+ +
+
obj1 ... objN
+
出力する JavaScript オブジェクトのリスト。 各オブジェクトの文字列表現が記述順で出力されます。
+
msg
+
0 個以上の置換文字列 (substitution strings) を含む JavaScript 文字列。
+
subst1 ... substN
+
msg 内の置換文字列を置換するJavaScript オブジェクト。これにより、出力の書式の詳細な制御が可能となります。
+
+ +

詳細については、{{domxref("console")}} ドキュメント内の コンソールへのテキスト出力 を参照してください。

+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Console API", "#error", "console.error()")}}{{Spec2("Console API")}}最初期の定義
+ +

ブラウザ実装状況

+ +
+ + +

{{Compat("api.Console.error")}}

+
+ +

関連情報

+ + diff --git a/files/ja/web/api/console/group/index.html b/files/ja/web/api/console/group/index.html new file mode 100644 index 0000000000..a70a1e210e --- /dev/null +++ b/files/ja/web/api/console/group/index.html @@ -0,0 +1,86 @@ +--- +title: Console.group() +slug: Web/API/console/group +tags: + - API + - DOM + - Debugging + - Method + - Web Development + - web console +translation_of: Web/API/Console/group +--- +
{{APIRef("Console API")}}
+ +

ウェブコンソールのログに、新たなインライングループを作成します。{{domxref("console.groupEnd()")}} を呼び出すまで、以降のすべての出力のレベルを 1 段階インデントします。

+ +

{{AvailableInWorkers}}

+ +

構文

+ +
console.group([label]);
+
+ +

引数

+ +
+
label
+
グループ用のラベル。任意。(Chrome 59 でテスト) console.groupEnd() は動作しません。
+
+ +

{{h3_gecko_minversion("コンソール内でのグループの使用", "9.0", "Using_groups_in_the_console")}}

+ +

ネストされたグループを使用して関連したメッセージを視覚的に結びつけることで、出力を整理する手助けができます。新しいネストのブロックを作成するには、console.group() を呼び出します。console.groupCollapsed() メソッドは類似していますが、新しいブロックが折りたたまれており、表示するには、展開ボタンをクリックする必要があります。

+ +

注記: Gecko 9 から Gecko 51 までは、groupCollapsed() メソッドは、group() と同じでした。折りたたまれたグループは、Gecko 52 から完全にサポートされます。{{bug("1088360")}} をご覧ください。

+ +

現在のグループを終了するには、console.groupEnd() を呼び出してください。例えば、以下のようなコードです:

+ +
console.log("This is the outer level");
+console.group();
+console.log("Level 2");
+console.group();
+console.log("Level 3");
+console.warn("More of level 3");
+console.groupEnd();
+console.log("Back to level 2");
+console.groupEnd();
+console.log("Back to the outer level");
+
+ +

出力は以下のようになります:

+ +

A screenshot of messages nested in the console output.

+ +

詳しくは、{{domxref("console")}} のドキュメントで コンソールでグループを使用するセクションをご覧ください。

+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Console API", "#group", "console.group()")}}{{Spec2("Console API")}}最初期の定義
+ +

ブラウザー実装状況

+ + + +

{{Compat("api.Console.group")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/console/groupcollapsed/index.html b/files/ja/web/api/console/groupcollapsed/index.html new file mode 100644 index 0000000000..a57b68cc78 --- /dev/null +++ b/files/ja/web/api/console/groupcollapsed/index.html @@ -0,0 +1,128 @@ +--- +title: Console.groupCollapsed() +slug: Web/API/console/groupCollapsed +tags: + - API + - DOM + - DOM Reference + - Debugging + - Method + - NeedsBrowserCompatibility + - Reference + - Web Development + - web console +translation_of: Web/API/Console/groupCollapsed +--- +
{{APIRef("Console API")}}{{Non-standard_header}}
+ +

Web コンソールに新たなインライングループを作成します。ただし {{domxref("console.group()")}} とは異なり、新しいグループは折りたたまれた状態で作成されます。グループ内に作成された項目を表示するには、グループの隣にある展開ボタンを使用して、ユーザが展開しなければなりません。

+ +

親グループに戻るには、{{domxref("console.groupEnd()")}} を呼び出します。

+ +

詳細および使用例は {{domxref("console")}} のドキュメントで、コンソールでグループを使用する をご覧ください。

+ +

{{AvailableInWorkers}}

+ +

構文

+ +
console.groupCollapsed();
+
+ +

引数

+ +

なし。

+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Console API", "#consolegroupcollapsedobject-object-", "console.groupCollapsed()")}}{{Spec2("Console API")}}最初期の定義
+ +

ブラウザ実装状況

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本サポート6{{CompatGeckoDesktop("9.0")}}[1]11{{CompatUnknown}}5.1[2]
Worker で使用可能{{CompatUnknown}}{{CompatGeckoDesktop("38.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本サポート{{CompatUnknown}}{{CompatGeckoMobile("9.0")}}[1]{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Worker で使用可能{{CompatUnknown}}{{CompatGeckoMobile("38.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

[1] Gecko 9.0 {{geckoRelease("9.0")}} よりこのメソッドをサポートしていますが、新しいグループは折りたたまれていません。このメソッドの機能は {{domxref("console.group()")}} と同じです。

+ +

[2] http://trac.webkit.org/changeset/60234 で実装。

+ +

関連情報

+ + diff --git a/files/ja/web/api/console/groupend/index.html b/files/ja/web/api/console/groupend/index.html new file mode 100644 index 0000000000..d688059c7f --- /dev/null +++ b/files/ja/web/api/console/groupend/index.html @@ -0,0 +1,120 @@ +--- +title: Console.groupEnd() +slug: Web/API/console/groupEnd +tags: + - API + - DOM + - Debugging + - Method + - NeedsBrowserCompatibility + - Web Development + - web console +translation_of: Web/API/Console/groupEnd +--- +

{{APIRef("Console API")}}{{Non-standard_header}}

+ +

Web コンソールで、現在のインライングループから出ます。詳細および使用例は {{domxref("console")}} のドキュメントで、コンソールでグループを使用する をご覧ください。

+ +

{{AvailableInWorkers}}

+ +

構文

+ +
console.groupEnd();
+
+ +

引数

+ +

なし。

+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Console API", "#consolegroupend", "console.groupEnd()")}}{{Spec2("Console API")}}最初期の定義
+ +

ブラウザ実装状況

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本サポート2{{CompatGeckoDesktop("9.0")}}11{{CompatVersionUnknown}}4.0[1]
Worker で使用可能{{CompatUnknown}}{{CompatGeckoDesktop("38.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本サポート{{CompatUnknown}}{{CompatGeckoMobile("9.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Worker で使用可能{{CompatUnknown}}{{CompatGeckoMobile("38.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

[1] http://trac.webkit.org/changeset/35421 で実装。

+ +

関連情報

+ + diff --git a/files/ja/web/api/console/index.html b/files/ja/web/api/console/index.html new file mode 100644 index 0000000000..bf373069fd --- /dev/null +++ b/files/ja/web/api/console/index.html @@ -0,0 +1,292 @@ +--- +title: console +slug: Web/API/console +tags: + - API + - Debugging + - Interface + - Reference + - console + - web console + - ウェブコンソール +translation_of: Web/API/Console +--- +

{{APIRef("Console API")}}

+ +

console オブジェクトは、ブラウザーのデバッグコンソール (例えば Firefox のウェブコンソール) へアクセスする機能を提供します。このオブジェクトの詳細な動作はブラウザーによって異なりますが、一般的に共通の機能セットが提供されています。

+ +

console オブジェクトには任意のグローバルオブジェクトからアクセスできます。閲覧スコープの {{domxref("Window")}} や、特定の種類のワーカーを表す {{domxref("WorkerGlobalScope")}} の console プロパティを通してアクセスできます。これは {{domxref("Window.console")}} として公開されていますが、単に console として参照できます。

+ +
console.log("Failed to open the specified link")
+ +

このページでは、 console オブジェクトで使用できる{{anch("Methods", "メソッド")}}や{{anch("Usage","使用例")}}を掲載します。

+ +

{{AvailableInWorkers}}

+ +
+

注: 経緯上の理由から、実際の console インターフェイスはすべて小文字で定義されています (つまり Console ではない)。

+
+ +

メソッド

+ +
+
{{domxref("console.assert()")}}
+
第 1 引数が false であれば、メッセージとスタックトレースをコンソールに出力します。
+
{{domxref("console.clear()")}}
+
コンソールをクリアします。
+
{{domxref("console.count()")}}
+
指定されたラベルでこの行が呼び出された回数をログ出力します。
+
{{domxref("console.countReset()")}}
+
指定されたラベルのカウンターの値をリセットします。
+
{{domxref("console.debug()")}}
+
ログレベルが debug のコンソールへメッセージを出力します。
+
{{domxref("console.dir()")}}
+
指定した JavaScript オブジェクトのプロパティの、対話型リストを表示します。このリスト内の三角印をクリックすると、子オブジェクトの内容を調査して表示させることができます。
+
{{domxref("console.dirxml()")}}
+
指定したオブジェクトを XML/HTML 要素で表現したものを表示します。表現できない場合は、JavaScript オブジェクトビューを表示します。
+
{{domxref("console.error()")}}
+
エラーメッセージを出力します。このメソッドでは、文字列置換および追加の引数を使用することができます。
+
{{domxref("console.exception()")}} {{Non-standard_inline}} {{deprecated_inline}}
+
error() の別名です。
+
{{domxref("console.group()")}}
+
以降の出力を別のレベルにインデントする、新たなインライングループを作成します。レベルを戻すには、groupEnd() を呼び出します。
+
{{domxref("console.groupCollapsed()")}}
+
以降の出力を別のレベルにインデントする、新たなインライングループを作成します。group() との違いは、グループが折りたたまれた状態で作られ、それを開くには展開ボタンを操作する必要があることです。レベルを戻すには、groupEnd() を呼び出します。
+
{{domxref("console.groupEnd()")}}
+
現在のインライングループから抜けます。
+
{{domxref("console.info()")}}
+
メッセージタイプのログ情報を出力します。このメソッドでは、文字列置換および追加の引数を使用することができます。
+
{{domxref("console.log()")}}
+
一般タイプのログ情報を出力します。このメソッドでは、文字列置換および追加の引数を使用することができます。
+
{{domxref("console.profile()")}} {{Non-standard_inline}}
+
ブラウザー内蔵のプロファイラー (例えば Firefox のパフォーマンスツール) を開始します。プロファイルの名称を指定することができます。
+
{{domxref("console.profileEnd()")}} {{Non-standard_inline}}
+
プロファイラーを停止します。結果のプロファイルは、ブラウザーのパフォーマンスツール (例えば Firefox のパフォーマンスツール) で確認できます。
+
{{domxref("console.table()")}}
+
表形式のデータを、表を使用して表示します。
+
{{domxref("console.time()")}}
+
入力引数で指定された名前のタイマーを開始します。ページあたり最大 10,000 個のタイマーを同時に動かすことができます。
+
{{domxref("console.timeEnd()")}}
+
指定されたタイマーを停止して、そのタイマーを開始してからの時間を秒単位でログに出力します。
+
{{domxref("console.timeLog()")}}
+
指定されたタイマーの値をコンソールへ出力します。
+
{{domxref("console.timeStamp()")}} {{Non-standard_inline}}
+
ブラウザのー Timeline やタイムラインツールにマーカーを追加します。
+
{{domxref("console.trace()")}}
+
スタックトレースを出力します。
+
{{domxref("console.warn()")}}
+
警告メッセージを出力します。このメソッドでは、文字列置換および追加の引数を使用することができます。
+
+ +

使用方法

+ +

コンソールにテキストを出力する

+ +

コンソールでもっとも頻繁に使用される機能は、テキストやその他のデータをログ出力することです。生成することができる出力のカテゴリは 4 つあり、{{domxref("console.log()")}}、{{domxref("console.info()")}}、{{domxref("console.warn()")}}、{{domxref("console.error()")}} の各メソッドを使用します。これらメソッドの出力結果はログ上でそれぞれ異なるスタイルがつけられ、また関心がある種類の出力だけを参照するためにブラウザーが提供するフィルタ機能を使用することもできます。

+ +

各出力メソッドを使用する方法は 2 つあります。複数の文字列表現を 1 つの文字列に連結してコンソールに出力する形でオブジェクトのリストを渡す方法と、オブジェクトのリストに続けてそれらを置き換える任意の個数の置換文字列を渡す方法です。

+ +

単一のオブジェクトの出力

+ +

もっとも簡単にログを記録する方法は、単一のオブジェクトを出力することです。

+ +
var someObject = { str: "Some text", id: 5 };
+console.log(someObject);
+
+ +

出力内容は以下のようになります。

+ +
[09:27:13.475] ({str:"Some text", id:5})
+ +

複数のオブジェクトの出力

+ +

ログ出力のメソッドを呼び出すときにオブジェクトを羅列することで、複数のオブジェクトを出力することもできます。

+ +
var car = "Dodge Charger";
+var someObject = { str: "Some text", id: 5 };
+console.info("My first car was a", car, ". The object is:", someObject);
+ +

出力は以下のようになります。

+ +
[09:28:22.711] My first car was a Dodge Charger . The object is: ({str:"Some text", id:5})
+
+ +

文字列置換の使用

+ +

文字列を取る console オブジェクトのメソッドの一つ (log() など) に文字列を渡すと、以下の置換文字列を使用することができます。

+ +
+
%o または %O
+
JavaScript オブジェクトを出力します。オブジェクト名をクリックすると、調査ツールで詳細情報を表示します。
+
%d または %i
+
整数値を出力します。数値の書式設定をサポートしています。例えば console.log("Foo %.2d", 1.1) は、先頭に 0 を補った有効数字 2 桁の数値として出力します: Foo 01
+
%s
+
文字列を出力します。
+
%f
+
浮動小数点数値を出力します。数値の書式設定に対応しています。例えば console.log("Foo %.2f", 1.1) は、小数部分が 2 桁の数値として出力し、 Foo 1.10 となります。
+
+ +
+

注: 精度の書式は Chrome では動作しません。

+
+ +

これらは引数リストの書式化文字列の後にある引数を引用します。例えば次のようになります。

+ +
for (var i=0; i<5; i++) {
+  console.log("Hello, %s. You've called me %d times.", "Bob", i+1);
+}
+
+ +

出力は以下のようになります。

+ +
[13:14:13.481] Hello, Bob. You've called me 1 times.
+[13:14:13.483] Hello, Bob. You've called me 2 times.
+[13:14:13.485] Hello, Bob. You've called me 3 times.
+[13:14:13.487] Hello, Bob. You've called me 4 times.
+[13:14:13.488] Hello, Bob. You've called me 5 times.
+
+ +

コンソールの出力のスタイル付け

+ +

%c ディレクティブを使用すると、コンソールの出力に CSS スタイルを適用することができます。

+ +
console.log("This is %cMy stylish message", "color: yellow; font-style: italic; background-color: blue;padding: 2px");
+ +

ディレクティブの前のテキストは影響を受けませんが、ディレクティブの後ろのテキストは引数の CSS 宣言を使用して装飾されます。

+ +

+ +

%c で利用できるプロパティは次の通りです (少なくとも、 Firefox では — 他のブラウザーでは異なる可能性があります)。

+ + + +
+

注: コンソールメッセージは、既定ではインライン要素と同様に動作します。 padding, margin などの効果を得たい場合は、例えば display: inline-block のように設定してください。

+
+ +

コンソールでのグループの使用

+ +

関連するデータを視覚的に結合することによりコンソール出力をまとめるのに役立つ、入れ子になったグループを使用することができます。新たな入れ子のブロックを作成するには、console.group() を呼び出します。console.groupCollapsed() メソッドはも似ていますが、こちらは折りたたまれた状態の新たなブロックを作成し、中身を読むには展開ボタンを操作してブロックを開く必要があります。

+ +

現在のグループを抜けるには、console.groupEnd() を呼び出します。例えば、以下のコードを実行します。

+ +
console.log("This is the outer level");
+console.group("First group");
+console.log("In the first group");
+console.group("Second group");
+console.log("In the second group");
+console.warn("Still in the second group");
+console.groupEnd();
+console.log("Back to the first group");
+console.groupEnd();
+console.debug("Back to the outer level");
+
+ +

出力は以下のようになります。

+ +

Demo of nested groups in Firefox console

+ +

タイマー

+ +

特定の操作にかかる時間を計るため、タイマーを設定することができます。タイマーを開始するには、引数で名前を指定して console.time() メソッドを呼び出します。タイマーを停止して経過時間をミリ秒単位で取得するには、タイマーの名前をまた引数で指定して console.timeEnd() メソッドを呼び出します。ページあたり最大 10,000 個のタイマーを同時に動かすことができます。

+ +

例えば、以下のコードを実行します。

+ +
console.time("answer time");
+alert("Click to continue");
+console.timeLog("answer time");
+alert("Do a bunch of other stuff...");
+console.timeEnd("answer time");
+
+ +

ユーザーがアラートボックスを解除するのにかかった時間を記録し、その時間をコンソールに記録し、ユーザーが2回目のアラートを解除するのを待ってから、終了時間をコンソールに記録します。

+ +

timerresult.png

+ +

タイマーの名前は、タイマーの開始時と停止時の両方で表示されることに注意してください。

+ +

注: タイマーをネットワーク通信の時間の計測に用いる場合、タイマーはトランザクション全体の所要時間を報告しますが、ネットワークパネルに表示される時間はヘッダーの処理にかかった時間だけを表すことに注意してください。レスポンス本文の記録を有効にしている場合は、レスポンスヘッダーとレスポンス本文それぞれに表示される所要時間の合計が、コンソールに出力されている時間に一致します。

+ +

スタックトレース

+ +

console オブジェクトはスタックトレースの出力にも対応しています。これは {{domxref("console.trace()")}} を呼び出した場所へ至るための呼び出し経路を表示するものです。以下のコードで考えましょう:

+ +
function foo() {
+  function bar() {
+    console.trace();
+  }
+  bar();
+}
+
+foo();
+
+ +

コンソールへの出力内容は以下のようになります。

+ +

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName('Console API')}}{{Spec2('Console API')}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Console")}}

+ +

注

+ + + +

関連情報

+ + + +

その他の実装

+ + diff --git a/files/ja/web/api/console/info/index.html b/files/ja/web/api/console/info/index.html new file mode 100644 index 0000000000..92d3ccd666 --- /dev/null +++ b/files/ja/web/api/console/info/index.html @@ -0,0 +1,66 @@ +--- +title: Console.info() +slug: Web/API/console/info +tags: + - API + - Debugging + - Method + - NeedsBrowserCompatibility + - Web Development + - web console +translation_of: Web/API/Console/info +--- +
{{APIRef("Console API")}}
+ +

Web コンソールに情報メッセージを出力します。Firefox および Chrome では、Web コンソールでこれらの項目の隣に小さな "i" のアイコンを表示します。

+ +

{{AvailableInWorkers}}

+ +

構文

+ +
console.info(obj1 [, obj2, ..., objN]);
+console.info(msg [, subst1, ..., substN]);
+
+ +

引数

+ +
+
obj1 ... objN
+
出力する JavaScript オブジェクトのリスト。各オブジェクトを文字列で表現したものを、リストの並び順に追記して出力します。
+
msg
+
0 個以上の置換文字列を含む JavaScript 文字列。
+
subst1 ... substN
+
msg 内の置換文字列を置き換える JavaScript オブジェクト。これにより、出力形式を高度に制御できます。
+
+ +

詳しくは {{domxref("console")}} のドキュメントで、コンソールにテキストを出力する をご覧ください。

+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Console API", "#consoleinfoobject--object-", "console.info()")}}{{Spec2("Console API")}}最初期の定義
+ +

ブラウザ実装状況

+ +

{{Compat("api.Console.info")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/console/log/index.html b/files/ja/web/api/console/log/index.html new file mode 100644 index 0000000000..7307c94e17 --- /dev/null +++ b/files/ja/web/api/console/log/index.html @@ -0,0 +1,101 @@ +--- +title: console.log() +slug: Web/API/Console/log +tags: + - API + - DOM + - Debugging + - HTML-tree + - Method + - Reference + - Web Development + - console + - console.dir() + - console.log() + - difference + - web console +translation_of: Web/API/Console/log +--- +
{{APIRef("Console API")}}
+ +

{{domxref("Console")}} の log() メソッドは、ウェブコンソールにメッセージを出力します。このメッセージは単一の文字列 (オプションの置換値を含む) であることもあれば、1 つ以上の JavaScript オブジェクトであることもあります。

+ +

{{AvailableInWorkers}}

+ +

構文

+ +
console.log(obj1 [, obj2, ..., objN]);
+console.log(msg [, subst1, ..., substN]);
+
+ +

引数

+ +
+
obj1 ... objN
+
出力する JavaScript オブジェクトのリスト。各オブジェクトの文字列表現が記述順で出力されます。 Chrome や Firefox の比較的新しいバージョンを使っているなら注意が必要です。これらのブラウザーで記録されるのはオブジェクトへの参照です。そのため、 console.log() を呼び出した時点でのオブジェクトの「値」が表示されるのではなく、内容を見るために開いた時点での値が表示されます。
+
msg
+
0 個以上の置換文字列を含む JavaScript 文字列
+
subst1 ... substN
+
JavaScript オブジェクトと msg 内の置換文字列を置換。これにより、出力の書式の詳細な制御が可能となります。
+
+ +

詳細については {{domxref("console")}} の「コンソールへのテキスト出力」の節を参照して下さい。

+ +

log() と dir() との違い

+ +

{{domxref("console.dir()")}} と console.log() の違いは何かという疑問を持つかもしれません。

+ +

Chrome では、コンソールに DOM 要素を送信した場合に大きな違いがあります。

+ +

+ +

ポイント:

+ + + +

特に、console.log は DOM 要素の取り扱いに特化していますが、console.dir はそうではありません。これは、DOM JS オブジェクトの全容を表現しようとする場合に役立ちます。

+ +

これらの機能に関する詳細情報が、Chrome Console API reference に掲載されています。

+ +

オブジェクトのログ出力

+ +

console.log(obj) を使わず、 console.log(JSON.parse(JSON.stringify(obj))) を使用してください。

+ +

これにより、ログを記録した瞬間の obj の値を確実に見ることができます。こうしないと、多くのブラウザーでは値が変化したときに常に更新されるライブビューになります。これは望むことではないかもしれません。

+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("Console API", "#log", "console.log()")}}{{Spec2("Console API")}}初回定義
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.Console.log")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/console/profile/index.html b/files/ja/web/api/console/profile/index.html new file mode 100644 index 0000000000..99c5ab6bdf --- /dev/null +++ b/files/ja/web/api/console/profile/index.html @@ -0,0 +1,126 @@ +--- +title: Console.profile() +slug: Web/API/console/profile +tags: + - API + - DOM + - Debugging + - Method + - Reference + - Web Development + - profile + - web console +translation_of: Web/API/Console/profile +--- +

{{APIRef("Console API")}}{{Non-standard_header}}

+ +

パフォーマンスプロファイル (例えば Firefox の パフォーマンスツール) の記録を開始します。

+ +

任意でプロファイル名を引数として与えることができ、複数のプロファイルを記録している場合に特定のプロファイルのみ停止することができます。引数の解釈方法については、{{domxref("Console.profileEnd()")}} をご覧ください。

+ +

{{domxref("Console.profileEnd()")}} を呼び出すと、記録を終了します。

+ +

{{AvailableInWorkers}}

+ +

構文

+ +
console.profile(profileName);
+
+ +

引数

+ +
+
profileName
+
プロファイルにつける名前。省略可能です。
+
+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Console API", "#consoleprofilelabel", "console.profile()")}}{{Spec2("Console API")}}最初期の定義
+ +

ブラウザ実装状況

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本サポート{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Worker で使用可能{{CompatUnknown}}{{CompatGeckoDesktop("38.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本サポート{{CompatUnknown}}{{CompatGeckoMobile("10.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Worker で使用可能{{CompatUnknown}}{{CompatGeckoMobile("38.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

関連情報

+ + diff --git a/files/ja/web/api/console/profileend/index.html b/files/ja/web/api/console/profileend/index.html new file mode 100644 index 0000000000..b6b29ad82b --- /dev/null +++ b/files/ja/web/api/console/profileend/index.html @@ -0,0 +1,130 @@ +--- +title: Console.profileEnd() +slug: Web/API/console/profileEnd +tags: + - API + - DOM + - Debugging + - Method + - Reference + - Web Development + - profileEnd + - web console +translation_of: Web/API/Console/profileEnd +--- +

{{APIRef("Console API")}}{{Non-standard_header}}

+ +

profileEnd メソッドは、{{domxref("Console.profile()")}} で開始したプロファイルの記録を終了します。

+ +

任意で引数にプロファイル名を与えることができます。引数を与えると、複数のプロファイルを記録している場合に特定のプロファイルのみ停止することができます。

+ + + +

{{AvailableInWorkers}}

+ +

構文

+ +
console.profileEnd(profileName);
+
+ +

引数

+ +
+
profileName
+
プロファイルにつける名前。この引数は省略可能です。
+
+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Console API", "#consoleprofileend", "console.profileEnd()")}}{{Spec2("Console API")}}最初期の定義
+ +

ブラウザ実装状況

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本サポート{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Worker で使用可能{{CompatUnknown}}{{CompatGeckoDesktop("38.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本サポート{{CompatUnknown}}{{CompatGeckoMobile("10.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Worker で使用可能{{CompatUnknown}}{{CompatGeckoMobile("38.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

関連情報

+ + diff --git a/files/ja/web/api/console/table/index.html b/files/ja/web/api/console/table/index.html new file mode 100644 index 0000000000..a19551948b --- /dev/null +++ b/files/ja/web/api/console/table/index.html @@ -0,0 +1,208 @@ +--- +title: Console.table() +slug: Web/API/console/table +tags: + - API + - DOM + - Debugging + - Method + - Web Development + - web console +translation_of: Web/API/Console/table +--- +
{{APIRef("Console API")}}{{Non-standard_header}}
+ +

表形式のデータを、表で表示します。

+ +

この関数は必須の引数 data があり、これは配列またはオブジェクトでなければなりません。また、省略可能な引数 columns もあります。

+ +

data を表として出力します。配列の各要素 (data がオブジェクトである場合は、列挙可能なプロパティ) が、表の行になります。

+ +

表の 1 番目の列に、(添字) というラベルがつきます。data が配列である場合、この値は配列の添字になります。data がオブジェクトである場合、この値はプロパティ名になります。(Firefox では) console.table は表示する行が 1000 行 (最初の行は見出し) に制限されていますので注意してください。

+ +

{{AvailableInWorkers}}

+ +

プリミティブ型の集合

+ +

引数 data に、配列またはオブジェクトを渡すことができます。

+ +
// 文字列の配列
+
+console.table(["apples", "oranges", "bananas"]);
+ +

+ +
// 値が文字列のプロパティを持つオブジェクト
+
+function Person(firstName, lastName) {
+  this.firstName = firstName;
+  this.lastName = lastName;
+}
+
+var me = new Person("John", "Smith");
+
+console.table(me);
+ +

+ +

複合的な型の集合

+ +

配列の要素やオブジェクトのプロパティ自体が配列やオブジェクトである場合、それらの要素やプロパティを 1 列ずつ置く形で、各行に列挙します:

+ +
// 配列の配列
+
+var people = [["John", "Smith"], ["Jane", "Doe"], ["Emily", "Jones"]]
+console.table(people);
+ +

Table displaying array of arrays

+ +
// オブジェクトの配列
+
+function Person(firstName, lastName) {
+  this.firstName = firstName;
+  this.lastName = lastName;
+}
+
+var john = new Person("John", "Smith");
+var jane = new Person("Jane", "Doe");
+var emily = new Person("Emily", "Jones");
+
+console.table([john, jane, emily]);
+ +

配列がオブジェクトを含む場合、表の列名はプロパティ名になります。

+ +

Table displaying array of objects

+ +
// 値がオブジェクトのプロパティを持つオブジェクト
+
+var family = {};
+
+family.mother = new Person("Jane", "Smith");
+family.father = new Person("John", "Smith");
+family.daughter = new Person("Emily", "Smith");
+
+console.table(family);
+ +

Table displaying object of objects

+ +

表示する列を制限する

+ +

デフォルトでは、console.table() はすべての要素を各行に出力します。省略可能な引数 columns を使用して、表示する列のサブセットを選択できます:

+ +
// オブジェクトの配列、ただし firstName のみ表示
+
+function Person(firstName, lastName) {
+  this.firstName = firstName;
+  this.lastName = lastName;
+}
+
+var john = new Person("John", "Smith");
+var jane = new Person("Jane", "Doe");
+var emily = new Person("Emily", "Jones");
+
+console.table([john, jane, emily], ["firstName"]);
+ +

Table displaying array of objects with filtered output

+ +

列で並べ替える

+ +

列の見出しをクリックすると、その列の値で表を並べ替えることができます。

+ +

構文

+ +
console.table(data [, columns]);
+
+ +

引数

+ +
+
data
+
表示するデータ。配列またはオブジェクトでなければなりません。
+
columns
+
出力する列名を持つ配列。
+
+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Console API", "#consoletabledata-columns", "console.table()")}}{{Spec2("Console API")}}最初期の定義
+ +

ブラウザ実装状況

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本サポート{{CompatVersionUnknown}}{{CompatGeckoDesktop("34.0")}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatNo}}
Worker で使用可能{{CompatVersionUnknown}}{{CompatGeckoDesktop("38.0")}}{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本サポート{{CompatUnknown}}{{CompatGeckoMobile("34.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Worker で使用可能{{CompatUnknown}}{{CompatGeckoMobile("38.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
diff --git a/files/ja/web/api/console/time/index.html b/files/ja/web/api/console/time/index.html new file mode 100644 index 0000000000..fc1118028c --- /dev/null +++ b/files/ja/web/api/console/time/index.html @@ -0,0 +1,66 @@ +--- +title: Console.time() +slug: Web/API/Console/time +tags: + - API + - DOM + - Debugging + - Method + - Web Development + - console + - web console + - メソッド +translation_of: Web/API/Console/time +--- +
{{APIRef("Console API")}}
+ +

処理時間がどれくらいかを計測するために使用することができるタイマーを開始します。各タイマーに一意の名前を付ければ、ページ内に10,000個までのタイマーを実行させることができます。同じ名前を引数として {{domxref("console.timeEnd()")}} を呼び出すと、タイマー開始からの経過時間がミリ秒単位で出力されます。

+ +

詳細や使用例については、 {{domxref("console")}} のページの 『タイマー』 を参照して下さい。

+ +

{{AvailableInWorkers}}

+ +

構文

+ +
console.time(label);
+
+ +

引数

+ +
+
label
+
新しいタイマーにつける名前。各タイマーの識別に用います。同じ名前を使用して {{domxref("console.timeEnd()")}} を呼び出すと、タイマーを終了して時間をコンソールに出力します。
+
+ +

仕様書

+ + + + + + + + + + + + + + + + +
仕様書状態備考
{{SpecName("Console API", "#consoletimelabel", "console.time()")}}{{Spec2("Console API")}}初回定義
+ +

ブラウザーの対応

+ + + +

{{Compat("api.Console.time")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/console/timeend/index.html b/files/ja/web/api/console/timeend/index.html new file mode 100644 index 0000000000..da6c41ee42 --- /dev/null +++ b/files/ja/web/api/console/timeend/index.html @@ -0,0 +1,129 @@ +--- +title: console.timeEnd +slug: Web/API/Console/timeEnd +tags: + - API + - DOM + - Debugging + - Method + - Non-standard + - Web Development + - console + - web console +translation_of: Web/API/Console/timeEnd +--- +
{{APIRef("Console API")}}{{Non-standard_header}}
+ +

概要

+ +

{{domxref("console.time()")}} の呼び出しによって開始したタイマーを停止します。

+ +

詳細や使用例については、 {{domxref("console")}} のページの 『タイマー』 の章を参照して下さい。

+ +

{{AvailableInWorkers}}

+ +

構文

+ +
console.timeEnd(timerName);
+
+ +

引数

+ +
+
timerName
+
停止するタイマーの名前。停止時に、この名前を伴って Web コンソールに経過時間が表示されます。
+
+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Console API", "#consoletimeendlabel", "console.timeEnd()")}}{{Spec2("Console API")}}最初期の定義
+ +

ブラウザ実装状況

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本サポート2{{CompatGeckoDesktop("10.0")}}11{{CompatVersionUnknown}}4.0
Worker で使用可能{{CompatUnknown}}{{CompatGeckoDesktop("38.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本サポート{{CompatUnknown}}{{CompatGeckoDesktop("10.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Worker で使用可能{{CompatUnknown}}{{CompatGeckoDesktop("38.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

関連情報

+ + diff --git a/files/ja/web/api/console/timestamp/index.html b/files/ja/web/api/console/timestamp/index.html new file mode 100644 index 0000000000..1495727272 --- /dev/null +++ b/files/ja/web/api/console/timestamp/index.html @@ -0,0 +1,125 @@ +--- +title: Console.timeStamp() +slug: Web/API/console/timeStamp +tags: + - API + - DOM + - Debugging + - Method + - NeedsBrowserCompatibility + - Web Development + - web console +translation_of: Web/API/Console/timeStamp +--- +
{{APIRef("Console API")}}{{Non-standard_header}}
+ +

ブラウザの Timeline やタイムラインツールにマーカーを 1 個追加します。レイアウトや描画のイベントなど、タイムラインで記録された他のイベントと、コード内のある位置を関連付けることができます。

+ +

任意で引数に、タイムラインのラベルを与えることができます。このラベルは、マーカーのそばに表示されます。

+ +

{{AvailableInWorkers}}

+ +

構文

+ +
console.timeStamp(label);
+
+ +

引数

+ +
+
label
+
タイムスタンプのラベル。省略可能です。
+
+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Console API", "#consoletimestamplabel", "console.timeStamp()")}}{{Spec2("Console API")}}最初期の定義
+ +

ブラウザ実装状況

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本サポート{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatNo}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
Worker で使用可能{{CompatVersionUnknown}}{{CompatGeckoDesktop("38.0")}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本サポート{{CompatUnknown}}{{CompatGeckoMobile("10.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Worker で使用可能{{CompatUnknown}}{{CompatGeckoMobile("38.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

関連情報

+ + diff --git a/files/ja/web/api/console/trace/index.html b/files/ja/web/api/console/trace/index.html new file mode 100644 index 0000000000..db2ebb2ec6 --- /dev/null +++ b/files/ja/web/api/console/trace/index.html @@ -0,0 +1,86 @@ +--- +title: Console.trace() +slug: Web/API/console/trace +tags: + - API + - Chrome + - DOM + - Debugging + - Firefox + - Method + - NeedsBrowserCompatibility + - String + - Web Development + - console + - console.trace() + - trace + - web console +translation_of: Web/API/Console/trace +--- +
{{APIRef("Console API")}}
+ +

{{domxref("console")}} インタフェースの trace() メソッドは、Web コンソールにスタックトレースを出力します。

+ +

{{AvailableInWorkers}}

+ +

詳細や使用例については、{{domxref("console")}} のドキュメントの スタックトレース をご覧ください。

+ +

構文

+ +
console.trace( [...any, ...data ]);
+ +

引数

+ +
+
...any, ...data {{optional_inline}}
+
コンソールにスタックトレースとともに出力されるゼロ個以上のオブジェクト。これらは、{{domxref("console.log()")}}メソッドに渡される場合と同じ方法でアセンブルおよびフォーマットされます。
+
+ +

例

+ +
function foo() {
+  function bar() {
+    console.trace();
+  }
+  bar();
+}
+
+foo();
+
+ +

コンソールには次のようなトレースが表示されます。

+ +
bar
+foo
+<anonymous>
+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Console API", "#trace", "console.trace()")}}{{Spec2("Console API")}}最初の定義
+ +

ブラウザ実装状況

+ + + +

{{Compat("api.Console.trace")}}

+ +

関連情報

+ + diff --git a/files/ja/web/api/console/warn/index.html b/files/ja/web/api/console/warn/index.html new file mode 100644 index 0000000000..da40943855 --- /dev/null +++ b/files/ja/web/api/console/warn/index.html @@ -0,0 +1,147 @@ +--- +title: Console.warn() +slug: Web/API/console/warn +tags: + - API + - DOM + - Debugging + - Method + - NeedsBrowserCompatibility + - Web Development + - web console +translation_of: Web/API/Console/warn +--- +
{{APIRef("Console API")}}{{non-standard_header}}
+ +

Web コンソールに警告メッセージを出力します。

+ +

{{AvailableInWorkers}}

+ +

{{Note("Firefox では、Web コンソールでこれらのログの隣に小さな感嘆符のアイコンを表示します。")}}

+ +

構文

+ +
console.warn(obj1 [, obj2, ..., objN]);
+console.warn(msg [, subst1, ..., substN]);
+
+ +

引数

+ +
+
obj1 ... objN
+
出力する JavaScript オブジェクトのリスト。各オブジェクトを文字列で表現したものを、リストの並び順に追記して出力します。
+
msg
+
0 個以上の置換文字列を含む JavaScript 文字列。
+
subst1 ... substN
+
msg 内の置換文字列を置き換える JavaScript オブジェクト。これにより、出力形式を高度に制御できます。
+
+ +

詳しくは {{domxref("console")}} のドキュメントで、コンソールにテキストを出力する をご覧ください。

+ +

仕様

+ + + + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName("Console API", "#consolewarnobject--object-", "console.warn()")}}{{Spec2("Console API")}}最初期の定義
+ +

ブラウザ実装状況

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本サポート{{CompatVersionUnknown}}{{CompatGeckoDesktop("2.0")}}8{{CompatVersionUnknown}}{{CompatVersionUnknown}}
置換文字列{{CompatUnknown}}{{CompatGeckoDesktop("9.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Worker で使用可能{{CompatUnknown}}{{CompatGeckoDesktop("38.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本サポート{{CompatUnknown}}{{CompatGeckoMobile("2.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
置換文字列{{CompatUnknown}}{{CompatGeckoMobile("9.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
Worker で使用可能{{CompatUnknown}}{{CompatGeckoMobile("38.0")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +

関連情報

+ + -- cgit v1.2.3-54-g00ecf