[解決済み] JavaScriptのオブジェクトのコピーを変更すると、元のオブジェクトも変更される
2023-01-27 21:46:09
質問
コピーしている
objA
を
objB
const objA = { prop: 1 },
const objB = objA;
objB.prop = 2;
console.log(objA.prop); // logs 2 instead of 1
配列でも同じ問題があります
const arrA = [1, 2, 3],
const arrB = arrA;
arrB.push(4);
console.log(arrA.length); // `arrA` has 4 elements instead of 3.
どのように解決するのですか?
という文が何を意味しているのか、誤解していることは明らかです。
var tempMyObj = myObj;
が何をするのかについて、いくつかの誤解があることは明らかです。
JavaScriptではオブジェクトは参照(正確には参照の値)で渡されたり代入されたりするので
tempMyObj
と
myObj
はどちらも同じオブジェクトへの参照です。
何が起こっているのかを視覚化するのに役立つかもしれない簡略化した図を以下に示します。
// [Object1]<--------- myObj
var tempMyObj = myObj;
// [Object1]<--------- myObj
// ^
// |
// ----------- tempMyObj
代入の後でわかるように、両方の参照は同じオブジェクトを指しています。
あなたは コピーを作成する を作成する必要があります。
// [Object1]<--------- myObj
const tempMyObj = Object.assign({}, myObj);
// [Object1]<--------- myObj
// [Object2]<--------- tempMyObj
古い回答です。
オブジェクトのコピーを作成する他の方法をいくつか紹介します。
すでにjQueryを使っているので
var newObject = jQuery.extend(true, {}, myObj);
バニラJavaScriptで
function clone(obj) {
if (null == obj || "object" != typeof obj) return obj;
var copy = obj.constructor();
for (var attr in obj) {
if (obj.hasOwnProperty(attr)) copy[attr] = obj[attr];
}
return copy;
}
var newObject = clone(myObj);
参照 を参照してください。 と はこちら
関連
-
[解決済み] JavaScriptで "use strict "は何をするのか、その根拠は?
-
[解決済み] JavaScriptでオブジェクトをディープクローンする最も効率的な方法は何ですか?
-
[解決済み] JavaScriptのオブジェクトが空であることをテストするにはどうすればよいですか?
-
[解決済み] とは何ですか! (not not)演算子とは何ですか?
-
[解決済み] JavaScriptのオブジェクトにキーが存在するかどうかをチェックする?
-
[解決済み] JavaScriptで現在のURLを取得する?
-
[解決済み] JavaScriptで要素のクラスを変更するにはどうすればよいですか?
-
[解決済み】JavaScriptのオブジェクトの長さ
-
[解決済み] TypeScriptのdeclare classとinterfaceの違いとは?
-
[解決済み] AngularJS - ngRepeatフィルタリングされた結果の参照を取得する方法
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] AngularJSのエラーです。Cross Origin リクエストはプロトコルスキーム http, data, chrome-extension, https に対してのみサポートされています。
-
[解決済み] Angularjs - 現在の日付を表示する
-
[解決済み] JavaScriptで、ある文字列が別の文字列の中に出現するすべてのインデックスを見つけるにはどうすればよいですか?
-
[解決済み] サブドメインにまたがってlocalStorageを使用する
-
[解決済み] CORS: 認証モードは 'include' です。
-
[解決済み] Chromeのwebkitインスペクタで「Unsafe JavaScript attempt to access frame with URL...」というエラーが継続的に発生する。
-
[解決済み] JavaScriptで長い配列を小さい配列に分割する方法
-
[解決済み] <ng-content>が空かどうかを確認する方法は?(これまでのAngular 2+で)
-
[解決済み] jQueryのバージョン1、バージョン2、バージョン3の違いは何ですか?[クローズド]
-
[解決済み] V8 Javascript エンジンのスタンドアロン実行