JavaScriptでオブジェクトの配列内の特定のオブジェクトを差し替えたい

Question

###前提・実現したいこと
JavaScriptでオブジェクトの配列内の特定のオブジェクトを差し替えたい。

###発生している問題・エラーメッセージ
functionの引数としてオブジェクトを渡した場合は元のオブジェクトは変わらない。
引数として配列を渡した場合は元の配列が変わる。
両方参照渡しだと思うのですが、この動作の違いが理解できずどうしたら実現できるかわかりません。

###該当のソースコード

let arr = [{"id":"123"}];
let obj = {"name":"hoge"};

updateObj(arr[0]);
console.log("arr[0]:"+ JSON.stringify(arr));
updateObj(obj);
console.log("obj:"+ JSON.stringify(obj));

function updateObj(obj){
    let piyo = {"name":"piyo"}
    obj = piyo;
};

updateArr(arr);
console.log("arr:"+ JSON.stringify(arr));
function updateArr(arr){
    let piyo = {"name":"piyo"}
    arr.push(piyo);
};

###試したこと
上記のテストコード

###補足情報(言語/FW/ツール等のバージョンなど)
JavaScript

Comments

[kei344]

arr[1]ではなくarr[0]では？

[knp]

ご指摘ありがとうございます。投稿するときに直し忘れてました。

Answer 1

JavaScriptでオブジェクト型を渡す場合について、**C++(仮引数に&つける)、C#(仮引数と実引数の両方にrefつける)、PHP(仮引数に&つける)での「参照渡し」(PHPマニュアルではリファレンス渡しとも)**と同じ動作/仕組みだという意味で「参照渡し」と言っているのであれば、**それは間違いです。**JavaScriptのオブジェクト型の評価戦略は、Javaの参照型、C#の参照型、PythonやRubyのオブジェクト等と同じ方法であり、値渡しの一種※です。

※ それを何と呼ぶのか一番良いのかを質問しているんですけど、なかなか回答が集まらず、ここでは呼び方は保留します。なお、C++、C#、PHPの参照渡しとは異なる意味で、この渡し方を「参照渡し」と呼ぶ人達は少なからずいます。

この渡し方では、仮引数そのもへの代入によって、呼び出し元の実引数が変わることはありません。なぜなら、一種の値渡しであるため、代入によって、仮引数の値が変わるだけであり、実引数の値は変わらないからです。

Objectを渡して、Objectそのものを変更したければ、

function updateObj(obj){
    let piyo = {"name":"piyo"}
    Object.assign(obj, piyo);
};

と、Object.assign()でマージしたり、

function updateObj(obj){
    obj.name = "piyo";
};

と、objのプロパティへの代入(これはobjであるところオブジェクト自体を書き換えているということです)する必要があります。Array側がうまくいくのはarr.push(piyo)がarrであるところの配列自体を書き換えているからです。

なお、上のコードの場合、undefinedを渡すとエラーになります。このままではarr[1]は最初の段階でundefinedになっていますので、let arr = [{"id":"123"}, {name: hoge}];などとして、エラーにならないようにしてください。

Comments

[knp]

丁寧な回答ありがとうございます。仮引数と実引数、共有渡しというキーワードで検索してなんとなく理解できました。
仮引数のプロパティやメソッドを使用した時は実引数への参照が維持され、仮引数に別のオブジェクトを代入した場合は実引数とは異なるオブジェクトを参照するようになるのですね。
http://qiita.com/makotoo2/items/50c6ee98c18f35688b17
https://ja.stackoverflow.com/questions/7109/javascript-%E3%81%AE-%E5%AE%9F%E5%BC%95%E6%95%B0%E3%82%B9%E3%82%B3%E3%83%BC%E3%83%97-%E3%81%AF-%E3%83%AD%E3%83%BC%E3%82%AB%E3%83%AB%E3%82%B9%E3%82%B3%E3%83%BC%E3%83%97-%E4%BB%AE%E5%BC%95%E6%95%B0%E3%82%B9%E3%82%B3%E3%83%BC%E3%83%97-%E3%81%A8%E5%90%8C%E3%81%98

Answer 2

updateObjのほうでは、let piyo = {"name":"piyo"}で新しいオブジェクトを作っていますので、元のオブジェクトを書き換えているわけではないのです。

obj.name='piyo';のように、直接書き換えれば戻った側にも影響します。

Comments

[knp]

回答ありがとうございます。どちらもオブジェクトを直接書き換えているつもりだったので、その違いが知りたかったです。