[JS] Object.assign 메서드에 대해 알아보자

2025. 1. 21. 20:33·Front-end/Javascript

Object.assign

객체를 복사하거나 객체를 병합할 때 사용하는 메서드
 Object.assign(target, ...sources)

target: 속성을 복사할 목표 객체

sources: 복사할 소스 객체 (1개 이상 가능)

 

Object.assign을 사용하면 객체의 얕은 복사가 가능하다.

 

객체 병합하기

const target = { a: 1, b: 2 };
const source1 = { b: 4, c: 5 };
const source2 = { d: 6 };

const result = Object.assign(target, source1, source2);

console.log(result); // 출력: { a: 1, b: 4, c: 5, d: 6 }

해당 코드를 작성하면, target의 값도 변하게 된다.

 

객체 복사하기

const original = { a: 1, b: 2 };
const copyObj = Object.assign({}, original);

console.log(copyObj); // 출럭: { a: 1, b: 2 }
console.log(copy === original); // 출력: false => 2개는 서로 다른 객체라고 판단힘

빈 객체를 활용해서 original 객체를 복사할 수 있다.

 

 

반응형
저작자표시 비영리 변경금지 (새창열림)

'Front-end > Javascript' 카테고리의 다른 글

[JS] 얕은 복사와 깊은 복사에 대해서 알아보자  (0) 2025.01.24
[JS] reduce는 무엇일까  (2) 2025.01.24
[JS] 단축 평가(Short Circuit Evaluation)  (1) 2025.01.20
[JS] 구조 분해 할당(Destructuring)  (1) 2025.01.20
[JS] 동기(synchronous)와 비동기(asynchronous)  (2) 2025.01.17
'Front-end/Javascript' 카테고리의 다른 글
  • [JS] 얕은 복사와 깊은 복사에 대해서 알아보자
  • [JS] reduce는 무엇일까
  • [JS] 단축 평가(Short Circuit Evaluation)
  • [JS] 구조 분해 할당(Destructuring)
집으로 감자
집으로 감자
Hello World
  • 집으로 감자
    Potato to Home
    집으로 감자
  • 전체
    오늘
    어제
  • 링크

    • Github
    • 분류 전체보기
      • Front-end
        • TIL
        • Javascript
        • Typescript
        • React
        • Next.js
        • CSS
        • 라이브러리
      • Algorithm
        • 프로그래머스: 기초 트레이닝
        • 프로그래머스 LV1
      • TroubleShooting
      • Problem & Solution
      • Project
      • Programing Knowledge
        • 개발 용어
        • CS
        • 운영체제
        • 자료구조
        • 데이터 베이스
  • 태그

    프로그래머스
    문제해결
    styledcomponent
    회고
    실행컨텍스트
    반응형웹
    CSS
    tanstackquery
    트러블슈팅
    react
    JavaScript
    Til
    http
    개발용어
    코딩테스트
  • 인기 글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.3
집으로 감자
[JS] Object.assign 메서드에 대해 알아보자
상단으로

티스토리툴바