Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- NonNullable
- javascript
- 반복줄이기
- 공통컴포넌트
- const 단언문
- utilty type
- 커스텀
- Chart.js
- TSDoc
- returnType
- 타입스크립트
- vue.js
- 리액트
- React.js
- CSS
- click and drag
- reactjs
- React Native
- react
- 제네릭
- 타입좁히기
- JS console
- 누구나 자료구조와 알고리즘
- 성능최적화
- 2022
- typescript
- 개발콘텐츠
- 티스토리꾸미기
- 폰트적용하기
- 레이아웃쪼개기
Archives
- Today
- Total
몽땅뚝딱 개발자
[Javascript] Object.assign() 본문
◽ Object.assign()
// target: 목표 객체. 출처 객체의 속성을 복사해 반영한 후 반환할 객체
// sources: 출처 객체. 목표 객체에 반영하고자 하는 속성들을 갖고 있는 객체들
Object.assign(target, ...sources)
◽ Object.assign() 사용하기
예제 1. 목표 객체의 속성 중 출처 객체와 동일한 키를 갖는 속성의 경우, 그 속성 값은 출처 객체의 속성 값으로 덮어쓴다.
const target = { a: 1, b: 2, c: 2 };
const source = { b: 4, c: {'name': 2, 'idx': 4} };
const returnedTarget = Object.assign(target, source);
console.log(target); // { a: 1, b: 4, c: Object { name: 2, idx: 4 } }
console.log(returnedTarget); // { a: 1, b: 4, c: Object { name: 2, idx: 4 } }
예제 2. 목표객체 자체가 변경된다.
const o1 = { a: 1 };
const o2 = { b: 2 };
const o3 = { c: 3 };
const obj = Object.assign(o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }
console.log(o1); // { a: 1, b: 2, c: 3 }, 목표 객체 자체가 변경됨.
예제 3. 문자열의 경우
const v1 = 'abc';
const obj = Object.assign({}, v1, 'defghi');
console.log(obj); // { 0: "d", 1: "e", 2: "f", 3: "g", 4: "h", 5: "i" }
◽ 브라우저 호환성
ie를 제외하고 모두 호환된다.
출처
개인적으로 공부한 내용을 정리하는 블로그로
잘못된 개념을 게시하지않도록 주의하고 있으나 오류가 있을 수 있습니다.
'Development > Javascript' 카테고리의 다른 글
[Javascript] window.pageYOffset (0) | 2021.12.27 |
---|---|
[Javascript] getBoundingClientRect() (0) | 2021.12.27 |
[jQuery] 제이쿼리 :: (4) 효과(Effects) (0) | 2021.12.09 |
[jQuery] 제이쿼리 :: (3) 이벤트(Event) (0) | 2021.12.09 |
[jQuery] 제이쿼리 :: (2) 문서 객체 조작(DOM Control) (0) | 2021.12.08 |
Comments