라이브러리

[JAVASCRIPT] structuredClone(obj) - 객체를 깊은 복사(Deep Copy)하여 새로운 객체 생성




structuredClone() 함수

structuredClone() 함수는 JavaScript 에서 객체를 복사하는 데 사용되는 함수입니다. 이 함수는 객체의 속성을 복사하는 데 사용되며, 객체의 참조를 복사하는 대신 실제 객체를 복사합니다. 이는 객체의 속성을 변경할 때 원본 객체에 영향을 미치지 않도록 합니다.

structuredClone() 함수의 특징

- 객체의 속성을 복사 : structuredClone() 함수는 객체의 속성을 복사하는 데 사용됩니다. 이는 객체의 참조를 복사하는 대신 실제 객체를 복사합니다.
- 원본 객체에 영향을 미치지 않음 : 객체의 속성을 변경할 때 원본 객체에 영향을 미치지 않습니다.
- 객체의 타입을 유지 : structuredClone() 함수는 객체의 타입을 유지합니다. 예를 들어, 객체의 속성이 배열이면 복사된 객체의 속성도 배열이 됩니다.

structuredClone() 함수의 예제

#hostingforum.kr
javascript

// 원본 객체

const originalObject = {

  name: 'John Doe',

  age: 30,

  address: {

    street: '123 Main St',

    city: 'Anytown',

    state: 'CA',

    zip: '12345'

  },

  hobbies: ['reading', 'hiking', 'coding']

};



// structuredClone() 함수를 사용하여 객체를 복사

const clonedObject = structuredClone(originalObject);



// 원본 객체의 속성을 변경

originalObject.name = 'Jane Doe';

originalObject.address.street = '456 Elm St';



// 복사된 객체의 속성을 출력

console.log(clonedObject);

// 출력: { name: 'John Doe', age: 30, address: { street: '123 Main St', city: 'Anytown', state: 'CA', zip: '12345' }, hobbies: [ 'reading', 'hiking', 'coding' ] }



// 원본 객체의 속성을 출력

console.log(originalObject);

// 출력: { name: 'Jane Doe', age: 30, address: { street: '456 Elm St', city: 'Anytown', state: 'CA', zip: '12345' }, hobbies: [ 'reading', 'hiking', 'coding' ] }


위 예제에서, structuredClone() 함수를 사용하여 원본 객체를 복사한 후 원본 객체의 속성을 변경했습니다. 복사된 객체의 속성을 출력했을 때 원본 객체의 속성이 변경되지 않은 것을 볼 수 있습니다.

structuredClone() 함수의 사용 사례

- 객체의 속성을 변경할 때 원본 객체에 영향을 미치지 않기 위해 : structuredClone() 함수를 사용하여 객체를 복사한 후 원본 객체의 속성을 변경할 수 있습니다.
- 객체의 타입을 유지하기 위해 : structuredClone() 함수를 사용하여 객체를 복사한 후 객체의 타입을 유지할 수 있습니다.

structuredClone() 함수의 제한 사항

- 원본 객체의 속성이 불변 객체일 때 : structuredClone() 함수는 불변 객체의 속성을 복사할 수 없습니다. 예를 들어, 원본 객체의 속성이 Immutable.js의 Map 인 경우 structuredClone() 함수를 사용하여 복사할 수 없습니다.
- 원본 객체의 속성이 Proxy 객체일 때 : structuredClone() 함수는 Proxy 객체의 속성을 복사할 수 없습니다. 예를 들어, 원본 객체의 속성이 Proxy 객체 인 경우 structuredClone() 함수를 사용하여 복사할 수 없습니다.
  • profile_image
    나우호스팅 @pcs8404　
    호스팅포럼 화이팅!

    댓글목록

    등록된 댓글이 없습니다.

  • 전체 177건 / 12 페이지

검색

게시물 검색