> 웹 프론트엔드 > JS 튜토리얼 > JavaScript ES6에서 속성을 기존 객체로 분해하는 방법은 무엇입니까?

JavaScript ES6에서 속성을 기존 객체로 분해하는 방법은 무엇입니까?

Barbara Streisand
풀어 주다: 2024-10-27 20:50:30
원래의
280명이 탐색했습니다.

How to Destructure Properties into an Existing Object in JavaScript ES6?

JavaScript ES6에서 기존 객체로 구조 분해

ES6에서는 구조 분해를 통해 한 객체의 속성을 다른 객체에 할당할 수 있습니다. 그러나 새 객체를 생성하는 대신 기존 객체에 속성을 전송하려는 시나리오가 발생할 수 있습니다.

질문:

어떻게 속성을 분해할 수 있습니까? 한 객체(예: foo)에서 다른 객체(예: oof)로 값을 전송하는 것과 같은 JavaScript ES6의 기존 객체인가요?

답변:

명시적이지는 않지만 ES6 구조 분해 구문에서 지원되므로 원하는 결과를 얻는 대체 접근 방식이 있습니다.

<code class="javascript">({x: oof.x, y: oof.y} = foo);</code>
로그인 후 복사

구조 분해 할당을 괄호로 묶고 oof의 기존 속성을 키로 사용하면 foo에서 값을 읽을 수 있습니다. oof의 해당 키에 씁니다. 그러나 이 접근 방식은 일부 대안만큼 간결하거나 우아하지 않습니다.

  • 직접 할당:
<code class="javascript">oof.x = foo.x;
oof.y = foo.y;</code>
로그인 후 복사
  • 배열 기반 루프:
<code class="javascript">['x', 'y'].forEach(prop => oof[prop] = foo[prop]);</code>
로그인 후 복사

결국 접근 방식의 선택은 개인 취향과 특정 사용 사례에 따라 다릅니다.

위 내용은 JavaScript ES6에서 속성을 기존 객체로 분해하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿