Geekly Articles each Day

JSのコンソールメソッドリファレンス

コンソールオブジェクトの体系的なメソッドが体系化されて以来、多くの時間が経過しました;一部のブラウザーは、以前は欠落していたメソッドのサポートを受けています。 このテーブルは開発者にとって自然な関心事なので、1つの記事に説明を追加して更新してみませんか？ Github

* -⊝--この環境ではメソッドは使用されません。
*±-メソッドが使用されますが、機能があります（ツールチップに表示されます）。
* `+`-メソッドの本格的な実装。
クロム ファイアバグ Firefox IE Node.js サファリ オペラ
assert（expression [、object、...]）
式がfalseの場合、console.errorが出力され、そうでない場合は何も出力されません。
+++ （28.0+）+++±
クリア（）
コンソールウィンドウをクリアします。
++-⊝-+-⊝-++
カウント（[オブジェクト]）
毎回、コード内の特定のポイントのパス数を表示します。 オブジェクトの引数がある場合、object.toString（）はカウンター値の前に表示されます。
+++ （30.0+）+-⊝-+±...
debug（オブジェクト[、オブジェクト、...]）
.debugが呼び出し元のコード行へのリンクを追加で表示した場合、コンソールオブジェクトの古いバージョンとの互換性のためにconsole.logと同等です。
.log（）と等しい++++-⊝-+±...
dir（オブジェクト）
オブジェクトはJavascriptオブジェクトとして表示されます（DOM要素、そのすべての属性とメソッドの場合）。 ％Oは、Chromeのconsole.logでも同様に機能します。
+++ （8+）+ （9+）+++
dirxml（オブジェクト）
オブジェクトXMLが表示されます。
++-⊝-+ （11+）-⊝-+±...
エラー（オブジェクト[、オブジェクト、...]）
console.traceの結果には、呼び出された場所のエラーも表示されます（プログラムの実行を停止することなく）。 console.logのように、パターン（％s、％d（％i）、％f、％o、％O、％c）がサポートされています。 コールスタックトレースの例（Firefox 31+）：
+±...++ （8+）++±...
例外（オブジェクト[、オブジェクト、...]）
エラー（）と同等
等しい.error（）-⊝--⊝-+ （28+）-⊝--⊝--⊝--⊝-
グループ（オブジェクト[、オブジェクト、...]）
コンソールでエントリの展開グループを開始します。その後、手動で折りたたむことができます。 グループは.groupEnd（）コマンドで終了します。 パターンがサポートされています（ .log（）を参照）。 サンプルコードと結果（記事「 ブラウザコンソールの機能 」、2013年）：
console.group("module A") console.log('a') console.log('a') console.log('a') console.group("nested module B") console.log('b') console.log('b') console.log('b') console.groupEnd() console.groupCollapsed("nested collapsed module C") console.log('c') console.log('c') console.log('c') console.groupEnd() console.groupEnd() console.group("module D") console.log('d') console.log('d') console.log('d') console.groupEnd()

++±...+ （11+）-⊝-+ （4+）+
groupCollapsed（オブジェクト[、オブジェクト、...]）
コンソールで最初に折りたたまれたレコードのグループを開始します。その後、手動で展開できます。 グループは.groupEnd（）コマンドで終了します。 パターンがサポートされています（ .log（）を参照）。
++±... （9+）+ （11+）-⊝-+ （5.1+）+
groupEnd（）
（Firefoxを除く）手動で折りたたむことができるログメッセージのグループの終わりを示します。
+++ （9+）+ （11+）-⊝-+ （4+）+
クロム ファイアバグ Firefox IE Node.js サファリ オペラ
情報（オブジェクト[、オブジェクト、...]）
これは.log（）に似ていますが、メッセージの種類を区別するために、たとえば重要度のグラデーションやこのメッセージグループの他の意味的な意味のために、異なる設計で実行されます。 パターンがサポートされています（.log（）で説明されています）。 Firebug、Chrome、IE9の違いの例：
+++++++
ログ（オブジェクト[、オブジェクト、...]）
スペースで区切って、コンソールに引数を出力します。 最も人気のあるコンソールコマンド。

パターン-最初の引数の特別な名前をサポートし、次の引数が用語に置き換えられるテンプレートとして使用する必要があることを示します（Cのprintf（）のように、はるかに単純です）。 例：

 console.log('   %d %s',10,''); console.log('  %f',Math.PI); console.log('%c %c %c%c ,   ','color:red;','font-size:16px;color:orange;','background:black;color:yellow;','font:normal;color:normal;background:normal;'); console.log('body as DOM: %o',document.getElementsByTagName('body')[0]); console.log('object: %O',{a:1,b:2}); console.log('body as Object: %O',document.getElementsByTagName('body')[0]);

置換された引数の値が変換されるパターンのタイプとデータのタイプ：
％sは文字列です。
％dまたは％iは数値です。
％fは浮動小数点数です（Firebugもサポートしています）。
％o -DOM要素（Firebugは要素をリンクとして表示します。Chromeはリンクに加えて要素をコンソールに表示します。Firefoxは要素をクリックしてモーダルウィンドウで開きます（このオブジェクトのすべての属性とメソッドが利用可能です）。
％O -JSオブジェクト（Firefoxではサポートされていません。ChromeはこのパターンのDOMオブジェクトをjsオブジェクトに変換します。Firebugは％oと％Oを区別しません）。
％c -CSSスタイル（色、背景、フォント。Firefoxでは-バージョン31以降）。 ％cパターンを使用したスタイリングの例（Firefox）：
（重要）++++++±...
markTimeline（）
Safariの.timeStamp（）に類似していますが、.timeStamp（）はサポートされていません。逆も同様です。
= .timeStamp（）-⊝--⊝--⊝--⊝--⊝-+-⊝-
プロフィール（[ラベル]）
Javascriptプロファイラーを起動し、 「ラベル」という名前で結果を表示します。
++（開発ツール）+ （10+）-⊝-+-⊝-
profileEnd（）
Javascriptプロファイラーをオフにします。
++（開発ツール）+ （10+）-⊝-+-⊝-
テーブル（データ[、列]）
2次元の表形式データ-表形式。 データ-配列またはオブジェクト（またはオブジェクトのオブジェクト、配列のオブジェクト）。その各要素はテーブルの行になります。 2次元配列の最初の列は、インデックス（0から）になります。 または、オブジェクトの場合、最初の列はオブジェクトのキーで構成されます。 Firefoxの例（オブジェクトのオブジェクト）：

列-行が配列から作成され、名前を数値インデックスにしたくない場合は、テーブルヘッダーの列名の追加配列。 上記-名前付き列またはオブジェクトのオブジェクトから取得した結果（Firefox）の例がありました。 以下は、columnsパラメーターなしの配列の配列からのものです。
+++ （34.0+）-⊝--⊝--⊝--⊝-
時間（ラベル）
名前ラベルの下のカウンター（ミリ秒）をオンにします。
+++ （10+）+ （11+）++ （4+）±
timeEnd（ラベル）
名前ラベルの下のカウンター（ミリ秒）を停止し、この名前の下で結果を公開します。 例（Chrome）：
+++ （10+）+ （11+）++ （4+）±
timeStamp（[ラベル]）
スクリプトのタイミング図にタイムスタンプを描画します。これにより、プログラムのダイナミクスを監視できます。 例（Firebug）：
++-⊝--⊝--⊝--⊝--⊝-
トレース（）
実行時の関数のスタックトレースを表示します（エラーの場所で停止するときに通常表示されるものと同じ）。 Safari（サイドバー）、Chrome（コンソール）の例：

Firefoxの場合：
+++ （10+）+ （11+）++ （7.0.1+）±...
警告（オブジェクト[、オブジェクト、...]）
.log（）および.info（）に似ていますが、メッセージタイプを区別するために別のデザインで発行されます。 パターンがサポートされています（.log（）で説明されています）。
+++++++
デバッガー
現在の行でJavaScriptの実行を停止します。 デバッガでブレークポイントを設定するのと同じです。 停止することに加えて、実行可能プログラムには影響しません。
（オペレーター）+++++++
新しいエラー（ 'mesasge'）をスローします。
現在の行でJavascriptの実行を停止し、実行を中断します。 （すべてのJavascriptランタイムでサポートされています。）
クロム ファイアバグ Firefox IE Node.js サファリ オペラ


• ChromeのコンソールAPIリファレンス
• FirebugのコンソールAPI
• コンソールオブジェクト（MDN）
• IE10のコンソールオブジェクト（MSDN）
• Node.js v0.12.0で
• ... Safari Web Inspectorガイド
• Opera Dragonflyのコンソール

• コンソールを最大限に活用します
• console.table（）を使用した高度なJavaScriptデバッグ
• Firebug 1.6リリース （console.table）
• F12ツールコンソールを使用してエラーとステータス （MSDN） を表示する
• ... +その他 -Firefox Developer Toolsエピソード 31-コンソールスタックトレース、Fx31のスタイル付きコンソールログ。

• FireBug *コンソールAPI - 2013年のブラウザーテストで見られた実装の微妙な点について説明しています 。
• JavaScriptコンソールAPI

UPD ：誰もがこの説明を完成させ、別の言語に翻訳し、ブラウザーの進化に合わせて更新し、 コードがGithubに配置され、多言語の基礎と、このプレートに独自のスポイラーを追加する機能を提供します（もちろん、記事のスポイラー、出版サイトにリンクされています）。 （説明のルートは英語版ですが、Githubのテーブルのマークアップは品質が向上するはずです）。

UPD ：コメントには、列によるソートを行う提案がありました（この環境ではサポートされていないメソッドを分離するため）。 （Githaba.ioで）ネタバレを含む説明が1行にプッシュされる場合、標準のスクリプトソーターを使用できます（マニアはいますか？LANに書き込むか、レイアウトに同意する必要がある場合は、ネタバレを行うので発行してください）。

UPD 2015-03-21：ネタバレ、表示モード、およびHTMLは、この出版物よりも柔軟です。 これと完全に拡張された形式だけでなく、表の行ごとに1つの方法で、より密な形式でも、クリックしてそれらを切り替える可能性があります。 英語版 。

Source: https://habr.com/ru/post/J253359/

More articles:


All Articles