1 files changed, 101 insertions, 0 deletions
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
+---
+<div>{{APIRef("Console API")}}</div>
+
+<p><span class="seoSummary">{{domxref("Console")}} の <strong><code>log()</code></strong> メソッドは、ウェブコンソールにメッセージを出力します。</span>このメッセージは単一の文字列 (オプションの置換値を含む) であることもあれば、1 つ以上の JavaScript オブジェクトであることもあります。</p>
+
+<p>{{AvailableInWorkers}}</p>
+
+<h2 id="Syntax" name="Syntax">構文</h2>
+
+<pre class="syntaxbox notranslate">console.log(<var>obj1</var> [, <var>obj2</var>, ..., <var>objN</var>]);
+console.log(<var>msg</var> [, <var>subst1</var>, ..., <var>substN</var>]);
+</pre>
+
+<h3 id="Parameters" name="Parameters">引数</h3>
+
+<dl>
+ <dt><code>obj1</code> ... <code>objN</code></dt>
+ <dd>出力する JavaScript オブジェクトのリスト。各オブジェクトの文字列表現が記述順で出力されます。 Chrome や Firefox の比較的新しいバージョンを使っているなら注意が必要です。これらのブラウザーで記録されるのは<em>オブジェクトへの参照</em>です。そのため、 <code>console.log()</code> を呼び出した時点でのオブジェクトの「値」が表示されるのではなく、内容を見るために開いた時点での値が表示されます。</dd>
+ <dt><code>msg</code></dt>
+ <dd>0 個以上の置換文字列を含む JavaScript 文字列</dd>
+ <dt><code>subst1</code> ... <code>substN</code></dt>
+ <dd>JavaScript オブジェクトと <code>msg</code> 内の置換文字列を置換。これにより、出力の書式の詳細な制御が可能となります。</dd>
+</dl>
+
+<p>詳細については {{domxref("console")}} の「<a href="/ja/docs/Web/API/console#Outputting_text_to_the_console">コンソールへのテキスト出力</a>」の節を参照して下さい。</p>
+
+<h2 id="log_と_dir_との違い">log() と dir() との違い</h2>
+
+<p>{{domxref("console.dir()")}} と <code>console.log()</code> の違いは何かという疑問を持つかもしれません。</p>
+
+<p>Chrome では、コンソールに DOM 要素を送信した場合に大きな違いがあります。</p>
+
+<p><img alt="" src="https://i.imgur.com/DozDcYR.png"></p>
+
+<p>ポイント:</p>
+
+<ul>
+ <li><code>console.log</code> は、要素を HTML 状のツリーとして出力します。</li>
+ <li><code>console.dir</code> は、要素を JSON 状のツリーとして出力します。</li>
+</ul>
+
+<p>特に、<code>console.log</code> は DOM 要素の取り扱いに特化していますが、<code>console.dir</code> はそうではありません。これは、DOM JS オブジェクトの全容を表現しようとする場合に役立ちます。</p>
+
+<p>これらの機能に関する詳細情報が、<a href="https://developers.google.com/chrome-developer-tools/docs/console-api#consoledirobject">Chrome Console API reference</a> に掲載されています。</p>
+
+<h2 id="Logging_objects" name="Logging_objects">オブジェクトのログ出力</h2>
+
+<p><code>console.log(obj)</code> を使わず、 <code>console.log(JSON.parse(JSON.stringify(obj)))</code> を使用してください。</p>
+
+<p>これにより、ログを記録した瞬間の <code>obj</code> の値を確実に見ることができます。こうしないと、多くのブラウザーでは値が変化したときに常に更新されるライブビューになります。これは望むことではないかもしれません。</p>
+
+<h2 id="Specification" name="Specification">仕様書</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">仕様書</th>
+   <th scope="col">状態</th>
+   <th scope="col">備考</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName("Console API", "#log", "console.log()")}}</td>
+   <td>{{Spec2("Console API")}}</td>
+   <td>初回定義</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
+
+<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div>
+
+<p>{{Compat("api.Console.log")}}</p>
+
+<h2 id="See_also" name="See_also">関連情報</h2>
+
+<ul>
+ <li><a class="external" href="http://www.opera.com/dragonfly/documentation/console/">Opera Dragonfly documentation: Console</a></li>
+ <li><a class="external" href="http://msdn.microsoft.com/library/gg589530">MSDN: F12 ツールのコンソールを使ったエラーおよびステータスの表示</a></li>
+ <li><a href="http://getfirebug.com/wiki/index.php/Console_API">Firebug wiki: Console API</a> - Firebug は console.log() で <a href="http://www.softwareishard.com/blog/firebug/firebug-tip-styled-logging/">『スタイリングされたログ出力』</a> などの追加機能もサポートしています。</li>
+ <li><a href="http://nodejs.org/docs/latest/api/console.html#console_console_log_data">NodeJS: Console API</a></li>
+</ul>