리액트 배우고 있는데 기본적인것들이 막히네요..
본문
// setupProxy.js
const {createProxyMiddleware} = require('http-proxy-middleware');
module.exports = function(app){
app.use(
createProxyMiddleware("/api",{
target:"http://localhost:8080",
changeOrigin:true,
})
)
}
위 코드에서, 첫 변수 선언에,
const {create...} 라 되어 있는데 왜 { } 가 변수이름에 씌워져 있나요?..
관련된 부분을 알아보려면 어떤 것을 검색해서 학습하면 될까요?
ㅠ
위 내용 출처는,
https://velog.io/@sae1013/React-%EC%99%80-Node.js-%EC%97%B0%EB%8F%99%ED%95%98%EA%B8%B0
입니다.
고맙습니다.
답변 2
좀 쉽게 설명 드리자면,
require 는 php include/require 와 비슷한 동작을 합니다. 해당 파일을 불러 오는 것 이지요.
이건 아실 꺼고,
const http = require('http-proxy-middleware');
http.createProxyMiddleware(...)
이렇게 사용 하는 것을, DogFoot 답변처럼 해당 메소드만 할당 받아서 아래처럼 사용 할 수 있는 것 입니다.
const {createProxyMiddleware} = require('http-proxy-middleware');
createProxyMiddleware(...)
이렇게 사용하는 이유는 (php 처럼 설명하자면) class 안의 모든 메소드를 불러오는 것이 아니라,
사용할 메소드만 불러오는 것입니다.
Spread syntax 문법도 자주 나오니 알아 두시면 좋습니다.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax
고맙습니다. 설명해주셔서 쉽게 이해가 되네요.
개체 분해 할당에 의해서 그러한 문법이 가능합니다.
아래 링크 참고 하시면 됩니다. ^^
ES6 destructuring assignment
제목이 Object destructuring 부분쯤 읽어주시면 이해가 되실겁니다.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
고맙습니다. 말씀하신 부분 학습해보겠습니다~!
