전개연산자 (Spread)

심채운·2022년 7월 20일
0

JavaScript

목록 보기
7/14

전개 연산자

하나의 배열데이터를 ,로 구분하는 각각의 item으로 배열데이터가 전개해서 문자데이터로 출력(만들어짐)

const fruits = ['Apple', 'Banana', 'Cherry']
console.log(fruits) // ['Apple','Banana','Cherry']
console.log(...fruits) // Apple Banana Cherry

또한 배열데이터를 객체데이터로 바꿀 수 도 있는데

function toObject(a,b,c) {
  return {
    a: a,
    b: b,
    c: c
  }
}
console.log(toObject(...fruits)) //{ a: 'Apple', b: 'Banana', c: 'Cherry' }

매개변수 부분에도 전개연산자를 사용할 수 있고 그때는 이 매개변수가 나머지의 모든 인수들을 다 받아내는 역할을 한다. 그래서 이 매개변수를 rest parameter 라고 부른다.

const fruits = ['Apple', 'Banana', 'Cherry','Orange']
console.log(fruits) // [ 'Apple', 'Banana', 'Cherry', 'Orange' ]
console.log(...fruits) // Apple Banana Cherry Orange

function toObject(a,b,...c) {
  return {
    a: a,
    b: b,
    c: c
  }
}
console.log(toObject(...fruits)) //{ a: 'Apple', b: 'Banana', c: [ 'Cherry', 'Orange' ] }

결국 전개연산자로 배열데이터를 ,로 구분해서 전개할 수도 있고, 매개변수에서도 전개할 수도 있는데 매개변수에서 사용할때는 갯수에 상관없이 일단 순서대로 받아보고 그 순서가 명확하지 않을때 나머지를 전부 다 받는 용도로 매개변수 앞에 전개연산자를 사용해서 그것들을 배열의 형태로 순서대로 다 받아서 내부에서 사용할 수 있다.
만약 속성의 이름과 거기에 사용하는 변수의 이름 즉 데이터의 이름이 같으면 이것을 축약형으로 만들어 줄 수가 있다.

function toObject(a,b,...c) {
  return {
    a,
    b,
    c
  }
}
console.log(toObject(...fruits)) //{ a: 'Apple', b: 'Banana', c: [ 'Cherry', 'Orange' ] }

화살표 함수를 이용해 더 축약하면

const fruits = ['Apple', 'Banana', 'Cherry','Orange']
console.log(fruits) // [ 'Apple', 'Banana', 'Cherry', 'Orange' ]
console.log(...fruits) // Apple Banana Cherry Orange

const toObject = (a,b,...c) =>  ({a,b,c})
console.log(toObject(...fruits)) //{ a: 'Apple', b: 'Banana', c: [ 'Cherry', 'Orange' ] }
profile
불가능, 그것은 사실이 아니라 하나의 의견일 뿐이다. - 무하마드 알리

0개의 댓글