구조 분해 할당

구조 분해 할당

객체나 배열에 저장된 데이터 전체가 아닌 일부만 변수에 할당할 경우 생김

객체나 배열을 변수로 ‘분해’ 할 수 있께 해주는 구조 분해 할당을 사용 가능

함수 매개변수 많거나 매개 변수 기본값 필요한 경우 등에서도 발휘

• 배열 분해하기

  let [item1 = default, item2, ...rest] = array

  array의 첫 번째 요소는 item1, 두 번째 요소는 변수 item2에 할당

  나머지 요소는 배열 rest 에 저장

  • ‘분해’는 ‘파괴’를 의미하지 않습니다

    분해 대상은 수정 또는 파괴 되지 않음

  • 쉼표를 사용하며 요소 무시하기

    쉼표 사용시 필요하지 않은 배열 요소 버릴 수 있음

  • 할당 연산자 우측엔 모든 이터러블 올 수 있음

    배열 뿐 아니라 모든 이터러블에 구조 분해 할당 적용 가능

  • 할당 연산자 좌측엔 뭐든지 올 수 있습니다

    할당 연산자 좌측엔 ‘할당할 수 있는 것’이라면 무엇이든 올 수 있음

    객체 프로퍼티도 가능

  • .entries() 로 반복하기

    Object.entries(obj) 와 구조 분해 조합 시 객체, 맵의 키, 값 순회하며 변수로 분해 할당 가능

  • 변수 교환 트릭

    두 변수에 저장된 값 교환할 때 구조 분해 할당으로 가능

  • ‘…’ 로 나머지 요소 가져오기

    할당 하고 남은 변수 모아서 저장할 때 사용

    가장 마지막에 위치해야 함

    배열로 저장됨

  • 기본값

    할당할 값 없을 때 = 이용하여 기본값 설정 가능

• 객체 분해하기

  let (prop: varName = defalut, ...rest) = object

  object 의 프로퍼티 prop 의 값은 varName 이 없을 땐 prop에, varName이 있을 땐 varName 에 할당.

  object 에 prop 없으면 default 가 varName 에 할당

  연결할 변수가 없는 나머지 프로퍼티 들은 객체 rest에 복사

  • ‘…‘로 나머지 요소 가져오기

    … 로 할당하고 남은 프로퍼티 할당 가능

    객체로 저장됨

    • let 없이 사용

      할당 연산 let {…} = {…} 안에 변수 선언하지 않고 기존에 있던 변수에 분해한 값 할당 시 에러 발생

      주요 흐름 상에 있는 {…} 를 코드 블록으로 인식

      괄호로 감싸서 코드 블록이 아닌 표현식으로 해석

  • 기본값

    할당할 값 없을 때 = 이용하여 기본값 설정 가능

• 중첩 구조 분해

  객체나 배열이 다른 객체나 배열 포함하는 경우, 복잡한 패턴 사용해 중첩 배열이나 객체 정보 추출 가능

  대입 연산자 좌측의 패턴과 우측의 정보를 추출하려는 대상의 패턴이 일치할 시 각 변수에 추출 가능

• 똑똑한 함수 매개변수

  함수 매개변수 문접은 구조 분해 할당 문법과 동일

  매개변수 모두를 객체에 모아 함수의 인자에 전달

  함수는 전달받은 객체 분리하여 변수에 할당하고 원하는 작업 수행 가능

  중첩 객체와 콜론 조합 가능

  함수 매개변수 구조 분해할 때 반드시 인수가 전달된다고 가정되고 사용된다는 점에 유의. 빈 객체를 인수 전체 기본값을 만들면 해결

요약

• 객체나 배열을 변수로 분해할 때 구조 분해 할당 사용

• 함수 매개변수 문법도 구조 분해 할당과 동일

• 배열 분해는 let [item1 = default, item2, ...rest] = array 로 진행

• 객체 분해는 let (prop: varName = defalut, ...rest) = object 로 진행

• 분해는 분해 대상을 수정하거나 파괴하지 않음

• 쉼표로 요소 무시 가능

• 할당 연산자 우측엔 모든 이터러블 올 수 있음

• 할당 연산자 좌측엔 ‘할당할 수 있는 것’이라면 뭐든 올 수 있음

• 모든 인수 분해 가능

• 변수 교환 트릭 가능

• ‘…’ 로 나머지 요소 배열에 가져오기 가능

• 기본값 설정 가능

• 중첩 구조 분해는 대입 연산자 좌측의 패턴과 우측의 정보를 추출하려는 대상의 패턴이 일치할 시 각 변수에 추출 가능