아랄라랄라
R 스토리
아랄라랄라
전체 방문자
오늘
어제
  • All (198)
    • Web (145)
      • Markup | WEB (9)
      • Styles (45)
      • javascript (32)
      • jquery (28)
      • vue (16)
      • react (10)
      • more (5)
    • IT (31)
      • CS (3)
      • git hub (5)
      • UI | UX (18)
      • more (5)
    • ETC (22)
      • 이슈노트 (12)
      • 스터디 (10)
      • 아랄라 ☞☜ (0)
      • JOB🛠 (0)

인기 글

반응형
hELLO · Designed By 정상우.
아랄라랄라
Web/javascript

[자바스크립트] 전개연산자

[자바스크립트] 전개연산자
Web/javascript

[자바스크립트] 전개연산자

2023. 4. 25. 11:28

 

 

전개 연산자는 ... 으로 표시되며, 배열, 객체, 문자열 등을 개별 요소로 분해한다.

이를 통해 배열이나 객체를 풀어서 각각의 요소로 사용할 수 있다.

 

 

 

다음은 전개 연산자를 사용하는 몇 가지 예시이다.

 

 


배열 분해

 

const arr = [1, 2, 3];
console.log(...arr); // 1 2 3

위 코드에서 전개 연산자를 사용하여 arr 배열의 각 요소를 개별적으로 출력한다.

 

 

 

const arr1 = [1, 2];
const arr2 = [3, 4];
const combinedArr = [...arr1, ...arr2];
console.log(combinedArr); // [1, 2, 3, 4]

위 코드에서 전개 연산자를 사용하여 두 배열을 합쳐서 새로운 배열을 생성한다.

 

 

 

 

 

 


객체 분해

const obj = {x: 1, y: 2};
console.log({...obj, z: 3}); // {x: 1, y: 2, z: 3}

위 코드에서 전개 연산자를 사용하여 obj 객체와 새로운 속성 z를 합쳐서 새로운 객체를 생성한다.


 

const obj1 = {x: 1};
const obj2 = {y: 2};
const combinedObj = {...obj1, ...obj2};
console.log(combinedObj); // {x: 1, y: 2}

위 코드에서 전개 연산자를 사용하여 두 객체를 합쳐서 새로운 객체를 생성한다.

 

 

 

 


전개 연산자는 이 외에도 여러 곳에서 유용하게 사용된다. 

예를 들어, 함수 호출 시 전개 연산자를 사용하여 인수를 전달하거나, 배열과 객체의 요소를 복사하거나 이동할 때 사용할 수 있다.

 

 

728x90
저작자표시 (새창열림)

'Web > javascript' 카테고리의 다른 글

[자바스크립트] offsetX, screenX, clientX, pageX, layerX 각각의 차이  (0) 2023.08.01
[자바스크립트] textContent와 innerText 차이  (0) 2023.05.02
[자바스크립트] DOMContentLoaded, load 차이  (0) 2023.04.14
[자바스크립트] Optional Chaining 연산자(?.)  (0) 2023.01.18
[자바스크립트] axios  (0) 2022.12.30

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.