-
질문 & 답변
카테고리
-
세부 분야
모바일 앱 개발
-
해결 여부
미해결
{ } 의미를 정확하게 이해를 못하겠습니다.ㅠㅠ
20.10.17 22:48 작성 조회수 593
0
가끔 변수를 선언할때등에 중괄호{ } 안에 변수명이나 컴포넌트이름이 들어가는데 왜 그런지 이해를 할 수가 없습니다.
가령
const { params } = this.props.route;
import {Component} .........
위의 경우에서 왜 중괄호로 써야하는지 이해가 안됩니다.
참고할 만한 문서가 있을까요?
답변을 작성해보세요.
0
0
Wintho
지식공유자2020.10.19
pysoon70님,<o:p></o:p>
안녕하세요. 지식공유자 Wintho입니다.<o:p></o:p>
<o:p> </o:p>
문의 주신 내용에 답변 드립니다.<o:p></o:p>
<o:p> </o:p>
우선,<o:p></o:p>
import React, { Component } from ‘react’;<o:p></o:p>
에서의 중괄호 사용법에 대해 설명 드리겠습니다.<o:p></o:p>
어떤 module을 import 할 때 중괄호를 쓰는 것은, 그 module이 export 되는 방법과 연관이 있습니다.<o:p></o:p>
<o:p> </o:p>
예를 들어, 저희가 App.js에서 가장 하단에 export default App; 이라고 쓰고, App이라는 class를 default로 export 하고 있죠.<o:p></o:p>
그런 경우에는 다른 곳에서 중괄호를 쓰지 않고 import 해줍니다.<o:p></o:p>
import App from ‘./App’;<o:p></o:p>
이렇게요.<o:p></o:p>
하지만, class를 export하는 방법에는 default 방법만 있는 것은 아닙니다. Named Export라는 것이 있는데,<o:p></o:p>
export {App}; 이라고 export 된 class를 다른 곳에서 import 해줄 경우,<o:p></o:p>
import {App} from ‘./App’;<o:p></o:p>
과 같은 형식으로 import 해주게 됩니다.<o:p></o:p>
결국, React에서 제공해주는 API가 어떻게 구성되어있는지의 문제라고 할 수 있습니다.<o:p></o:p>
<o:p> </o:p>
다음으로,<o:p></o:p>
const { params } = this.props.route;<o:p></o:p>
에서의 중괄호 사용법에 대해 설명 드리겠습니다.<o:p></o:p>
이 경우는 상기에서 설명드린 내용과는 상이합니다.<o:p></o:p>
여기서는 params라는 객체를 선언하는 것이기 때문에, 중괄호는 객체를 감싸고 있다고 생각하시면 됩니다.<o:p></o:p>
그래서 params.userIdx, params.userName, params.userLastName와 같이<o:p></o:p>
객체 뒤에 . 을 찍어서 객체 내의 key값에 접근을 할 수 있는 것이죠.<o:p></o:p>
<o:p> </o:p>
감사합니다.<o:p></o:p>
답변 2