두 JavaScript 객체의 속성을 동적으로 병합하는 방법은 무엇입니까?

<시간/>

자바스크립트 객체의 속성을 동적으로 병합하는 두 가지 방법이 있습니다. 그들은

1) Object.assign()

Object.assign() 메서드는 하나 이상의 소스 개체에서 대상 개체로 모든 속성 값을 복사하는 데 사용됩니다. 대상 개체를 반환합니다. .

예시-1

<html>
<body>
<script>
   var target = { a: "ram", b: "rahim" };
   var source = { c: "akbar", d: "anthony" };
   var returnedTarget = Object.assign(target, source);
   document.write(JSON.stringify(target));
   document.write(JSON.stringify(returnedTarget));
</script>
</body>
</html>

출력

{"a":"ram","b":"rahim","c":"akbar","d":"anthony"}
{"a":"ram","b":"rahim","c":"akbar","d":"anthony"}

개체에 동일한 키가 있는 경우 배포에 나중에 나타나는 개체의 키 값이 복사됩니다. 다음 예는 값이 다른 동일한 키가 있는 시나리오를 보여줍니다.

예시-2

<html>
<body>
<script>
   var target = { a: "ram", b: "rahim" };
   var source = { b: "akbar", d: "anthony" };
   var returnedTarget = Object.assign(target, source);
   document.write(JSON.stringify(target));
   document.write("</br>");
   document.write(JSON.stringify(returnedTarget));
</script>
</body>
</html>

출력

{"a":"ram","b":"akbar","d":"anthony"}
{"a":"ram","b":"akbar","d":"anthony"}

2) 스프레드 연산자 사용

확산 연산자 여러 요소/변수/인수가 예상되는 위치에서 표현식을 확장할 수 있습니다. 여러 값이 예상되는 가변 배열에서 주로 사용됩니다. 자바스크립트 개체는 키 값 쌍을 이루는 개체이므로 스프레드 연산자를 사용하여 하나로 병합할 수 있습니다.

구문

var target = [...obj1, ...obj2, ...]

예시

<html>
<body>
<script>
   var target = { a: "ram", b: "rahim" };
   var source = { b: "akbar", d: "anthony" };
   var returnedTarget = {...target, ...source}
   document.write(JSON.stringify(returnedTarget));
</script>
</body>
</html>

출력

{"a":"ram","b":"akbar","d":"anthony"}