JS : 전개 구문(Spread syntax)

전개 구문(Spread syntax)

🔗 참고자료
MDN 전개구문
BigTop_Log 자바스크립트 전개구문 이해하기
HANAMON Spread / Reat 문법 (feat. 구조 분해 할당)

전개 구문을 사용하면 배열이나 문자열과 같이 반복 가능한 문자를 펼칠 수 있게 해준다.

⚙️ 문법

// 객체
{...obj}

// 배열
[...arr]

// 혹은
{...arr}

⚙️ 전개 구문 예시

1. 객체를 전개 구문으로 작성하면?

let info1 = {
  'name': 'Kate',
  'age': 34
};

let info2 = {
  ...info1,
  'address': 'Seoul',
  'phone': '010-1234-1234'
};

// { name: 'Kate', age: 34, address: 'Seoul', phone: '010-1234-1234' }
console.log(info2);

2. 배열을 전개 구문으로 작성하면?

// 1번
const lst = [1,3,5,6,8,10]
console.log(...lst); // 1 3 5 6 8 10

// 2번
let arr = [5, 7, 1, 3, 2, 9, 11];
function solution(arr) {
      return Math.min(...lst);
}

console.log(solution(arr));

// 3번
let lst1 = ['a','b','c'];
let lst2 = ['1','2','3'];

console.log([...lst1, ...lst2]);  // [ 'a', 'b', 'c', '1', '2', '3' ]

// 4번
let lst1 = ['a','b','c'];
let lst2 = [...lst1];  // lst1.slice()와 유사 ▶ 배열 복사
lst2.push('happy');

console.log(lst1);  // [ 'a', 'b', 'c' ]
console.log(lst2);  // [ 'a', 'b', 'c', 'happy' ]

---

함수 호출에서의 전개

apply()

let arr = [5, 7, 1, 3, 2, 9, 11];
function solution(arr) {
      return Math.min.apply(null, arr);
}

console.log(solution(arr));

---

🗓️ 수정 및 추가

• 2022.02.24
  1. 썸네일 변경