JSでprototypeで宣言したプロパティに値を代入するときの罠

<pre class="code lang-javascript" data-lang="javascript">var Hoge = function() {};

Hoge.prototype.huga = 0; Hoge.prototype.piyo = { x: 0, y: 10 };

var hoge = new Hoge();

// hogeにはhugaというプロパティが無いので、 // Hoge.prototype.hugaが参照される。 console.log(hoge.huga); // => 0

// こちらも同様 console.log(hoge.piyo.x); // => 0;

<pre class="code lang-javascript" data-lang="javascript">hoge.huga = 1;     // hogeにhugaというプロパティがつくられて、そこに代入される。

hoge.piyo.x = 100; // Hoge.property.xに代入される。

<pre class="code lang-javascript" data-lang="javascript">var hoge2 = new Hoge();

// prototypeが書き変わっているので、デフォルト値が変わっている。 console.log(hoge2.piyo.x) // => 100;

<pre class="code lang-javascript" data-lang="javascript">var piyo = { x: hoge.piyo.x, y: hoge.piyo.y };

piyo.x = 100; hoge.piyo = piyo;