JavaScript 객체 참조 및 복사 이해 - 간략한 설명

JavaScript에서 객체로 작업할 때는 객체 참조와 객체 복사의 차이점을 이해하는 것이 중요합니다. 자세한 개요는 다음과 같습니다.

---

객체 참조

1. 객체는 참조 유형입니다:
   • 객체를 변수에 할당하면 객체 자체의 복사본이 아니라 객체가 저장된 메모리 위치에 대한 참조를 할당하는 것입니다.
   • 하나의 참조를 통해 객체를 수정하면 동일한 객체에 대한 모든 참조에 영향을 미칩니다.

   let obj1 = { name: "Alice" };
   let obj2 = obj1; // obj2 now references the same object as obj1
   obj2.name = "Bob";
   console.log(obj1.name); // Output: "Bob"

1. 동등성 검사:
   • 두 변수는 내용이 동일하지 않고 메모리에서 동일한 개체를 참조하는 경우 동일합니다.

   let a = { key: "value" };
   let b = { key: "value" };
   console.log(a === b); // Output: false (different references)
   let c = a;
   console.log(a === c); // Output: true (same reference)

---

객체 복사

객체 복사에는 두 가지 주요 유형이 있습니다. 얕은 복사와 깊은 복사

1. 얕은 사본

• 얕은 복사본은 새 개체를 생성하지만 첫 번째 수준의 속성만 복사합니다. 중첩된 개체나 배열은 복제되지 않고 계속 참조됩니다.

얕은 복사 기술:

• 객체.할당():
  

   let original = { name: "Alice", details: { age: 25 } };
   let copy = Object.assign({}, original);
   copy.details.age = 30;
   console.log(original.details.age); // Output: 30 (shared reference)
  

• 확산 연산자(...):
  

   let original = { name: "Alice", details: { age: 25 } };
   let copy = { ...original };
   copy.details.age = 30;
   console.log(original.details.age); // Output: 30 (shared reference)
  

• 두 방법 모두 얕은 복사본을 생성합니다. 즉, 중첩된 개체가 여전히 연결되어 있습니다.

2. 딥 카피

• 전체 복사는 중첩된 구조를 포함하여 전체 개체를 복제합니다. 새 개체는 원본 개체와 완전히 독립적입니다.

딥 카피 기술:

• JSON.parse() 및 JSON.stringify():
  

   let original = { name: "Alice", details: { age: 25 } };
   let copy = JSON.parse(JSON.stringify(original));
   copy.details.age = 30;
   console.log(original.details.age); // Output: 25
  

  • 제한: 이 방법은 함수, 정의되지 않음, Infinity 또는 Date 또는 RegExp와 같은 특수 객체를 처리하지 않습니다.

• StructuredClone()(최신 JavaScript):
  

   let original = { name: "Alice", details: { age: 25 } };
   let copy = structuredClone(original);
   copy.details.age = 30;
   console.log(original.details.age); // Output: 25
  

  • 이 방법은 대부분의 극단적인 경우(예: 순환 참조)를 처리하지만 이전 환경에서는 지원되지 않습니다.

• 사용자 정의 라이브러리:

  • lodash와 같은 라이브러리를 사용하세요.

     let obj1 = { name: "Alice" };
     let obj2 = obj1; // obj2 now references the same object as obj1
     obj2.name = "Bob";
     console.log(obj1.name); // Output: "Bob"
  

---

요약표

Action	Result
Assignment (=)	Creates a reference. Changes to one variable affect the other.
Shallow Copy	Creates a new object but retains references for nested objects.
Deep Copy	Creates a completely independent object, including nested structures.

액션

결과

과제(=) 참조를 생성합니다. 한 변수를 변경하면 다른 변수에도 영향을 미칩니다. 얕은 사본 새 개체를 생성하지만 중첩된 개체에 대한 참조는 유지합니다. 깊은 복사 중첩 구조를 포함하여 완전히 독립적인 개체를 생성합니다.

이러한 개념을 이해하면 JavaScript에서 객체 작업 시 의도하지 않은 부작용을 방지하는 데 도움이 됩니다!

위 내용은 JavaScript 객체 참조 및 복사 이해 - 간략한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!