JavaScript에서 객체 복사

JavaScript는 모두 객체에 관한 것입니다. 그러나 객체로 작업하거나 애플리케이션에 OOP 접근 방식을 사용하는 것은 여전히 ​​많은 사람들에게 어렵습니다. 이 블로그를 통해 JavaScript에서 객체 복사와 관련된 유용한 정보를 함께 배울 것입니다.

객체를 복사하는 이유는 무엇입니까?

JavaScript에는 기본 데이터 유형과 참조 데이터 유형의 두 가지 데이터 유형이 있습니다. 개체는 참조 데이터 유형 아래에 있으므로 참조에 의해 액세스됩니다(값이 없고 할당된 메모리를 가리키는 포인터가 있음). 다른 참조 데이터 유형은 Array, Functions, Date 등입니다.

empObj가 있고 값이 newObj에 할당된 아래 JS 코드를 고려하십시오.

const empObj = { Name: 'John Doe', empId: 123, location: 'NewYork' };
const newObj = empObj;

이제 newObj의 위치를 ​​변경하고 터미널에서 두 객체를 모두 인쇄하려고 하면 수정된 코드는 다음과 같습니다.

newObj.location = 'Chicago';
console.log(empObj, newObj);

출력은 다음과 같습니다.

{ Name: 'John Doe', empId: 123, location: 'Chicago' } { Name: 'John Doe', empId: 123, location: 'Chicago' }

따라서 Object는 참조 데이터 유형이므로 newObj를 변경하면 empObj도 변경됩니다. 따라서 오래된(원본) 개체도 영향을 받습니다.

무엇을 할 수 있습니까?

원래 객체, 우리의 경우 empObj가 변경되지 않았는지 확인하려면 객체를 새 변수에 할당하는 대신 자바스크립트에서 객체를 복사해야 합니다.

자바 스크립트에서 객체를 복사하는 방법?

이를 위해 널리 사용되는 두 가지 옵션이 있습니다.

스프레드 연산자 사용

Object.assign() 사용

스프레드 연산자(...)

JavaScript의 ES6은 JS 객체의 복사본을 생성할 수 있는 스프레드 연산자를 제공합니다. 개체뿐만 아니라 스프레드 연산자를 사용하여 배열의 복사본을 만들 수도 있습니다.


통사론

객체, 배열 또는 함수 호출 내에서 ...(점 3개)를 사용하면 스프레드 연산자로 작동합니다.

const newObject = {...oldObject}

이것은 oldObject의 값을 newObject에 복사합니다. 따라서 다른 위치에서 newObject 및 oldObject 포인트를 만듭니다.


우리 코드의 애플리케이션:

아래 수정된 코드를 고려하십시오.

const empObj = { Name: 'John Doe', empId: 123, location: 'NewYork' };
const newObj = { ...empObj };
newObj.location = 'Chicago';
console.log(empObj, newObj);

위의 스크립트를 실행하면 다음과 같이 출력됩니다.

{ Name: 'John Doe', empId: 123, location: 'NewYork' } { Name: 'John Doe', empId: 123, location: 'Chicago' }

Objects.assign()

JavaScript의 이 assign() 메서드는 이전 객체의 모든 속성을 새 객체로 복사합니다. 새로 생성된 객체를 반환


통사론

Object.assign(newObject,oldObject)
이것은 oldObject의 값을 newObject에 복사합니다. 따라서 다른 위치에서 newObject 및 oldObject 포인트를 만듭니다.


우리 코드의 애플리케이션:

아래 수정된 코드를 고려하십시오.

const empObj = { Name: 'John Doe', empId: 123, location: 'NewYork' };
const newObj = Object.assign({}, empObj);
newObj.location = 'Chicago';
console.log(empObj, newObj);

위의 스크립트를 실행하면 다음과 같이 출력됩니다.

{ Name: 'John Doe', empId: 123, location: 'NewYork' } { Name: 'John Doe', empId: 123, location: 'Chicago' }

Object를 복사하는 또 다른 방법이 있습니다(블로그에서 논의되지 않음). JSON.stringify() 및 JSON.parse()를 사용하는 것입니다.

이것들은 JavaScript에서 객체를 복사하는 데 매우 유용한 기술입니다. 이 블로그가 귀하에게 많은 도움이 되고 궁금증이 해결되기를 바랍니다.