Javascript
 Computer >> コンピューター >  >> プログラミング >> Javascript

JavaScriptでspread演算子を使用してオブジェクトのクローンを作成するにはどうすればよいですか？

クローン作成 ある変数から別の変数にオブジェクトをコピーすることに他なりません。 代入演算子を使用した単純なクローン作成 私たちの意図どおりに機能しません。クローン作成が行われるとき、変数の変更は別の変数の変更を反映してはなりません。ただし、代入演算子の場合 、任意の変数の変更は、別の変数に確実に反映されます。したがって、この欠点を減らすために、ES6はスプレッド演算子を提供しています 。

例

次の例では、クローン作成 spread演算子を使用して行われます 。したがって、ある変数の変更は別の変数に反映されます。

<html>
<body>
<script>
   var org = {org1 : "Serveneedy", org2 : "Praveenlatha", org3 : "Redcross" };
   document.write(JSON.stringify("without change org :" + " "+ JSON.stringify(org)));
   var neworg = org;
   org.org1 = "gatesfoundation";
   document.write("</br>");
   document.write(JSON.stringify("with change org :" + " "+ JSON.stringify(org)));
   document.write("</br>");
   document.write(JSON.stringify("change also reflected in neworg :" +" "+JSON.stringify(neworg)));
</script>
</body>
</html>

出力

"without change org : {\"org1\":\"Serveneedy\",\"org2\":\"Praveenlatha\",\"org3\":\"Redcross\"}"
"with change org : {\"org1\":\"gatesfoundation\",\"org2\":\"Praveenlatha\",\"org3\":\"Redcross\"}"
"change also reflected in neworg :{\"org1\":\"gatesfoundation\",\"org2\":\"Praveenlatha\",\"org3\":\"Redcross\"}"


例 次の例ではスプレッド演算子 元のオブジェクトの変更のために使用されます 複製されたオブジェクトには反映されません。 

<html>
<body>
<script>
   var org = {org1 : "Serveneedy", org2 : "Praveenlatha", org3 : "Redcross" };
   document.write(JSON.stringify("without change org :" + " "+ JSON.stringify(org)));
   var neworg = {...org};
   org.org1 = "gatesfoundation";
   document.write("</br>");
   document.write(JSON.stringify("with change org :" + " "+ JSON.stringify(org)));
   document.write("</br>");
   document.write(JSON.stringify("change also reflected in neworg" +" "+JSON.stringify(neworg)));
</script>
</body>
</html>

出力

"without change org : {\"org1\":\"Serveneedy\",\"org2\":\"Praveenlatha\",\"org3\":\"Redcross\"}"
"with change org : {\"org1\":\"gatesfoundation\",\"org2\":\"Praveenlatha\",\"org3\":\"Redcross\"}"
"change also reflected in neworg : {\"org1\":\"Serveneedy\",\"org2\":\"Praveenlatha\",\"org3\":\"Redcross\"}"

  1. JavaScriptスプレッド演算子

    JavaScriptのスプレッド演算子を使用すると、配列を個々の配列要素に展開できます。スプレッド演算子を使用するには、3つのドット（…）の前に配列名を付ける必要があります。 以下は、JavaScriptスプレッド演算子のコードです- 例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, i

  2. JavaScriptを使用してURLオブジェクトを作成するにはどうすればよいですか？

    以下は、JavaScriptを使用してURLオブジェクトを作成するためのコードです- 例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style&g