23/10/22 TIL __ import / export (2)

 

드디어 import, export를 했다!!

정말 막막했는데, 이리저리 만져보니 작동이 되었다. 

진행하면서 막혔던 부분들에 대해 정리하고, 오늘 알아간 부분들에 대해 정리하려고 한다.

 

 

😳  document is not defined 에러

연결을 시도하면서 console을 정말 많이 찍어봤다. 

vsCode의 터미널에서 node 파일명.js 방법으로 콘솔을 확인했는데,

이유는 처음 연결 할 때에 브라우저에서 어떤것도 확인 할 수 없었기 때문에 작은 것부터 node 콘솔로 확인해 나갔다. 

그렇게 쭉이어오다 보니 ....

document.querySelector()를 이용해 컨트롤 하던 부분에서 이런 에러를 마주하게 되었다. 

찾아보니, document 라는 애는 브라우저에 존재하고, node환경 에서는 존재하지 않기 때문에 발생하는 문제였다. 

브라우저 환경에서 테스트 해보니 바로 작동 확인을 할 수 있었다. 

 

 

 

😳  기능별로 쪼개서 함수로 만들고, 그것을 묶어서 하나의 파일로.

어떻게 쪼개야 할지, 어떻게 묶어야 할지, 어떻게 export, import 해야할 지 감이 안왔는데,

하고나서 다른분께 조언을 구하고 나니 이제야 좀 정리가 되는 것 같았다. 

 

• import 나가있는 애들 땡겨오는 애
• export 밖에 나와서 대기하고 있는 애
• 함수 뿐만 아니라, 변수, 객체도 가능
• js 파일들을 나눠서 관리할 때에, 어떻게 나눠야 효율적일지 고민하기
• main.js 파일은 중심이며, 이 파일이 먼저 실행됨

 

 

 

😳  여러 파일과 함수들을 주고 받으면 비동기  잘 되어 있는지 확인하기

 

나는 분명 함수를 실행시켰는데, 해당 함수가 안불러와 지는 경우가 있었다. 

함수 실행 후에 그 결과를 가져오기 전에, 함수 실행 결과를 담은 변수를 출력했기 때문이였다.

코딩을 하면 할수록 언제 실행되는가 에 대한 생각을 해야만 한다는걸 느낀다.