回答編集履歴

テキスト修正

2018/07/19 13:07

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -212,7 +212,7 @@
-![イメージ説明](a01455e533ed4f1d88e07c1914033b88.png)
+![イメージ説明](5714aacce469379ceec4b9c3e24cd179.png)

テキスト修正

2018/07/19 13:07

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -242,9 +242,7 @@
-余談ですが、マップや連想配列やハッシュといった、キーと値の組を持つデータ構造を、（表示するときではなく）
+余談ですが、マップや連想配列やハッシュといった、キーと値の組を持つデータ構造を、（表示するときではなく）プログラムの中で定義するのに、 `=>` を使う言語があります。
-プログラムの中で定義するのに、 `=>` を使う言語があります。
 たとえばRubyでは

テキスト修正

2018/07/19 12:31

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -132,11 +132,7 @@
 と考えたほうがよいです。
-というのも、他の JavaScriptの実行環境（＝わかりやすくいうと、他の場所で動くJavaScript）の中には、
+というのも、他の JavaScriptの実行環境（＝わかりやすくいうと、他の場所で動くJavaScript）の中には、Mapオブジェクトを`console.log` で出力したときに、キーと値との対応を `=>` ではない記号で表しているものも、あり得るからです。
-Mapオブジェクトを`console.log` で出力したときに、キーと値との対応を `=>` ではない記号で
-表しているものも、あり得るからです。

テキスト修正

2018/07/19 12:29

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -114,7 +114,7 @@
 ```
-node v9.6.1 では Mapオブジェクトを`console.log` で出力すると、
+node v9.6.1 では Mapオブジェクトを console.log で出力すると、

テキスト修正

2018/07/19 12:29

投稿

jun68ykt

スコア9058

test CHANGED Viewed

@@ -65,3 +65,217 @@
 以上、参考になれば幸いです。
+---
+**追記**
+コメントから頂戴した、以下の質問に回答します。
+```
+●質問
+=> このアローが入ってきているのは、そういう仕様だということしょうか？
+piyoがkeyで、値が３という認識で合っていますでしょうか？
+```
+まず、
+> piyoがkeyで、値が３という認識で合っていますでしょうか？
+については、はい、その認識で合ってます。
+次に
+> => このアローが入ってきているのは、そういう仕様だということしょうか？
+については、そういう実装になっている、という解釈のほうがよいです。
+より詳しくは、私の回答では node v9.6.1 でJSを実行したものなので、
+```
+node v9.6.1 では Mapオブジェクトを`console.log` で出力すると、
+Map { 'piyo' => 3, 'hoge' => 2, 'fuga' => 1 }
+という風に、キーと値の対応を  => を使った形式で出力するように、
+console.log が作られている。
+```
+と考えたほうがよいです。
+というのも、他の JavaScriptの実行環境（＝わかりやすくいうと、他の場所で動くJavaScript）の中には、
+Mapオブジェクトを`console.log` で出力したときに、キーと値との対応を `=>` ではない記号で
+表しているものも、あり得るからです。
+例えば、以下のようなJSを含むHTMLを作ります。
+```html
+<!DOCTYPE html>
+<html lang="ja">
+<head>
+    <meta charset="UTF-8">
+    <title>Q136707</title>
+    <script>
+      document.addEventListener("DOMContentLoaded", function(event) {
+        const obj = {
+          tasks: [
+            { id: 1, item: 'piyo' },
+            { id: 2, item: 'hoge' },
+            { id: 3, item: 'piyo' },
+            { id: 4, item: 'fuga' },
+            { id: 5, item: 'hoge' },
+            { id: 6, item: 'piyo' }
+          ]
+        };
+        const counts = obj.tasks.reduce(
+          (m, t) =>  m.set(t.item, (m.get(t.item) || 0) + 1),
+          new Map()
+        );
+        console.log(counts);
+      });
+    </script>
+</head>
+<body>
+</body>
+</html>
+```
+そして、上記HTMLをMac版Firefox の最新バージョン(v61.0.1)で表示し、開発ツールを開いたところが以下です。
+![イメージ説明](a01455e533ed4f1d88e07c1914033b88.png)
+上記で分かるとおり、`=>` ではなく、 `→` が使われているので、
+```
+Mac版Firefox の最新バージョン(v61.0.1)に組み込まれたJavaScript処理系では、
+Mapオブジェクトを console.log で表示すると、
+Map(3) { piyo → 3, hoge → 2, fuga → 1 }
+と表示するように、 console.log が作られている。
+```
+と言えます。
+余談ですが、マップや連想配列やハッシュといった、キーと値の組を持つデータ構造を、（表示するときではなく）
+プログラムの中で定義するのに、 `=>` を使う言語があります。
+たとえばRubyでは
+```ruby
+counts = { 'piyo'=>3, 'hoge'=>2, 'fuga'=>1 }
+```
+と書きますし、PHPでは以下です。
+```php
+$counts = [ 'piyo'=>3, 'hoge'=>2, 'fuga'=>1 ];
+```
+ですので、 JavaScript で Mapオブジェクトを console.log で出力したとき
+`=>` が使われるのは、RubyやPHPを知っている人にとっては、自然な（というか見慣れた）
+感じがすることでしょう。