Mapオブジェクトはクリーン？

Question

Mapオブジェクトはクリーンなマップの生成が本当にできますか？

const a = Object.create(null);
const b = new Map();
console.log(a.__proto__); // undefined
console.log(b.__proto__); // Map / __proto__: Object

Object.create(null)は、本当に何も継承していませんが、
MapオブジェクトはMapからの__proto__でObjectも継承してますよね。

Object.create(null)はtoStringもありませんが、
MapオブジェクトはtoStringがあります。

オブジェクトで本当に何も継承したくないのなら、
Object.create(null)を使うしかないと思うのですが、
Mapオブジェクトがクリーンなマップの生成ができるとは、何のことでしょうか？
実際の挙動と合ってないのですが。

---

追記　『改訂新版JavaScript本格入門 ~モダンスタイルによる基礎から現場での応用まで』の142ページ

(3)クリーンなマップを生成できる

オブジェクトリテラルは、その実体はObjectオブジェクトです。配下には、Objectオブジェクトが標準で用意しているプロパティ(キー)が最初から存在します。空のオブジェクトリテラルを生成した時点で、すでに空ではないということです。
しかし、Mapオブジェクトはそれ専用のオブジェクトなので、完全に空の連想配列を生成できます。Objectオブジェクトでもcreateメソッドを利用すれば、強制的に空のオブジェクトを生成することもできますが、クリーンなマップを生成するならば、素直にMapオブジェクトを利用すべきでしょう。

Answer 1

Map は get メソッドと set メソッドを使います。

const m = new Map();
m.get('__proto__'); // undefined

Object.create(null) で作ったオブジェクトは、keys() のような連想配列として必須のメンバー有用なメンバーも消えてしまいます。

追記

const m = new Map();
console.log(m.get('__proto__')); // undefined
m.set('__proto__', '__proto__ が設定されましたがこれはオブジェクトメンバーではありません');
console.log(m.get('__proto__')); // __proto__ が設定されましたがこれはオブジェクトメンバーではありません

Comments

[dxon]

ありがとうございます。クリーンなマップ生成と書いている著者に質問してみます。

[Zuishin]

誰ですか？
ウェブ上の情報であればその URL を教えてください。

[dxon]

定番のJavaScript本格入門にある記述です。https://teratail.com/questions/216102 に新しく作りました。

[Zuishin]

合っています。この回答もそうなっています。

[Zuishin]

誤解のないように書き直しますが、合っているというのはその本に書いてあることが合っているという意味です。つまり、Map でクリーンな連想配列が作れます。

[Zuishin]

そして回答に書いた通り、Object.create(null) で作ったオブジェクトは連想配列としての重要な機能を失うので、Map を使うべきです。

[Zuishin]

追記したので実際に実行して確かめてください。

[dxon]

追記の件、ありがとうございます。Mapがsetとgetでクリーンなマップ生成ができることと、Object.create(null)のObject.prototypeさえ継承しない完全な空のオブジェクトとは別で、Object.prototypeさえ不要の時には、Object.create(null)しかないですよね。JavaScript本格入門を見ていて疑問に思ったことです。

[Zuishin]

keys() が使えないと、ほぼ使い物にならないので、Object.create(null) の出番は無いように思います。Object.prototype が不要の時というのはとても限定された特殊な場面だと思います。その本に書いてあるのは、完全に空のオブジェクトではなく、完全に空の連想配列の説明です。

[maisumakun]

ツッコミ忘れていたのですが、keysはもともとObject.keys(オブジェクト)の形で使うので、Object.prototypeを継承しているかいないかとは無関係に利用可能かと思います。

[dxon]

ES6で内容が空にできる連想配列専用のMapができても、結局オブジェクトですよね？連想配列専用の空の時にはMapを使っても、完全に空にしたい時にはObject.create(null)を使うしかないと思うのですが。

[Zuishin]

あ、keys() は私の間違いでした。ありがとうございます。

[Zuishin]

dxon さん、その本には完全に空のオブジェクトについては書いていないのではないですか？
よく読んでください。「空の連想配列」と書いていませんか？

[dxon]

連想配列のハッシュを管理するためのオブジェクトと書いてます。

[Zuishin]

管理するためのオブジェクトなので、管理ができればいいわけです。これは空である必要はありません。管理される連想配列は空ですね。

[maisumakun]

何のために「空の連想配列」ではなく「空のオブジェクト」が必要なのでしょうか。

[dxon]

名前空間オブジェクトは何も継承しなくていいので空オブジェクトが使えますが、Mapオブジェクトも空とあったので、同じように使えるのかと思っていたのが間違いの元だったんでしょうか？結局、Mapもオブジェクトなので、空のオブジェクトと同じように使えのかと思っていました。

[maisumakun]

> 名前空間オブジェクトは何も継承しなくていいので空オブジェクトが使えますが、Mapオブジェクトも空とあったので、同じように使えるのかと思っていたのが間違いの元だったんでしょうか？

はい、名前空間オブジェクトにMapは使えませんし、Mapのアクセス方法はオブジェクトとは全く別です。

Answer 2

オブジェクトで本当に何も継承したくないのなら、

Object.create(null)を使うしかないと思うのですが、
Mapオブジェクトがクリーンなマップの生成ができるとは、何のことでしょうか？

書いてのとおりです。Mapには'toString'だろうが'__proto__'だろうが、それどころかMathのようなオブジェクトすらキーにすることが可能ですが、Objectでこれらをキーとして値を入れても、意図したようには動きません。

Answer 3

「オブジェクト」と「連想配列」というのを混同していると思います。JavaScriptには「連想配列」はありません。ただ、「オブジェクト」を連想配列っぽく使うことができるというだけです。

JavaScriptの世界ではすべてのものがObjectです。
StringもNumberもFunctionもObjectです。
「連想配列っぽく使えるやつ」もObjectです。
MapもObjectです。つまり、Objectを継承しています。

すべてのものがObjectなので、無茶苦茶なことができます。「Object」というのは「無茶苦茶なことができるやつ」ということを意味しています。
下記は new String() でStringオブジェクトを生成した例です。
Objectなので独自にメンバーを追加することができるし、
StringなのでcharCodeAtメソッドを持っているし、
ObjectなのでtoStringメソッドを持っています (String to String !?)

let string = new String('The Earth');
string.answer = 42;
console.log(string, 'charCodeAt' in string, 'toString' in string);
// String {"The Earth", answer: 42} true true

オブジェクトリテラル {} で生成されるオブジェクトは当然 Object です。神みたいなやつなのでなんでもできます。連想配列っぽく使うこともできます。
Mapオブジェクトも Object を継承していますので、神にできることはなんでもできます。そのうえで、より連想配列として扱いやすくするためのメンバーが追加されています。次世代の神みたいなやつです。

たとえば、次のような違いがあります。

const obj = {};
const map = new Map();
const emp = Object.create(null);

obj.name   = 'The Earth';
obj.answer = 42;

map.set('name', 'The Earth');
map.set('answer', 42);

emp.name   = 'The Earth';
emp.answer = 42;


// 要素の数を取得したい
console.log(Object.keys(obj).length); // -> 2 (empも同じ)
console.log(map.size); // -> 2


// すべての要素に、あるいはすべての要素を使って何らかの処理をしたい
Object.keys(obj).forEach(key => {
  console.log(key, obj[key]);
}); // (empも同じ)

map.forEach((val, key) => {
  console.log(key, val)
});


// 自由な値をキーにしたい
// ここが「クリーン」の論旨と思います
obj.toString = 'foo';
console.log(obj.toString); // -> 'foo' (toString() メソッドが消滅する)

map.set('toString', 'foo');
console.log(map.get('toString'); // -> 'foo'
console.log(map.toString);       // -> ƒ toString() { [native code] }

emp.toString = 'foo';
console.log(emp.toString); // -> 'foo' (toString() メソッドはそもそも存在しないので、問題ないといえばない)

長々書きましたが、まあこんな感じです。
MDM も参考になると思います。

連想配列として使いたいObject	使いやすさ
{} で生成	使える
new Map() で生成	便利に使える (適している)
Object.create(null) で生成	使いにくい

Comments

[dxon]

そのコードを見ると、Mapの生成自体はクリーンですが、MapインスタンスはやっぱりObject.prototypeを継承しているので、Object.create(null)の空のオブジェクトとMapを一緒に出すのは混同するんですよね。質問の大元は、JavaScript定番本のJavaScript本格入門のMapの記述です。https://teratail.com/questions/216102 MapがtoStringでもクリーンなMapを生成できることは分かりましたが、何も継承しない完全に空ではないですよね。

[Zuishin]

メンバが完全に空だと連想配列として使いにくいので、メンバを保ったまま要素を空にすることができる Map を使いましょうというのが私の回答です。その本は「クリーンなオブジェクトが作れる」とは書いていません。「クリーンな連想配列が作れる」と書いてあります。オブジェクトと連想配列は違うものです。

[thyda.eiqau]

「何も継承しない完全な空」のObjectができたとして、それが何の役に立つのですか？連想配列として使うことが目的なのですよね？

[dxon]

名前空間オブジェクトとして使う時には何も継承する必要はないので、空のオブジェトが使えます。

[dxon]

「Objectオブジェクトでもcreateメソッドを利用すれば、強制的に空のオブジェクトを生成することもできますが、クリーンなマップを生成するならば、素直にMapオブジェクトを利用すべき」という記述を見ても、MapはObject.create(null)の空オブジェクトとは違うので、例えば、名前空間の空オブジェクトとしても使えないですよね？

[maisumakun]

前提を変えないでください。「名前空間の空オブジェクト」は「連想配列」ではありません。

[thyda.eiqau]

「名前空間オブジェクトとして使う時」というのはどこから出てきたのですか？命題は「クリーンな連想配列を作るには」だったはずです。
{}.toString // -> functionがすでに入っている (クリーンではない)
(new Map()).get('toString') // -> undefined = 何も入っていない (クリーン)
その本の著者も、あなたのこの質問に対する回答者も、これ以上の話はしていません。

[dxon]

JavaScript本格入門の、Object.create(null)でも強制的に空のオブジェクトの生成はできても、クリーンなマップ生成ならMapオブジェクトを利用すべきとあるので、完全に空のオブジェクトとしてObject.create(null)を出して、Mapも使えるという意味での記述は間違ってるのでは？と思った次第です。

[maisumakun]

どこが間違っているのでしょうか。「マップとして」使うのであれば、Mapオブジェクトのほうが適切です。

[dxon]

マップとして空の連想配列として使うならそうでしょうけど、Object.prototypeも継承しないnullオブジェクトのことも書いていて、Mapオブジェクトと書いてあるので、混同してしまったんですよね。

[thyda.eiqau]

{} をマップとして使うことができるか？
-> Yes
new Map() をマップとして使うことができるか？
-> Yes
Object.create(null) をマップとして使うことができるか？
-> Yes
マップとして使うならどれが適しているか？（どれを使うべきか？）
-> new Map()

[dxon]

本を見ると、nullと並置しているので、
nullのように、Mapオブジェクトも空のオブジェクト生成ができると思ったのが、
プロトタイプ継承をしているから、おかしいと思ったわけです。