오늘은 저번에 여행가느라 못들었던 실행 컨텍스트 관련 내용을 학습했다.
주된 내용은 JS의 실행 구조와 메모리 저장 구조에 대한 개념 정리였다.
또한 비동기/동기 함수와 async/await 함수의 실행 순서를 통한 출력 비교를 통해서 여태껏 api연결 시 오류가 났던 이유를 알 수 있었다.
간단히 말하자면 비동기/동기 함수 간의 순서는 무조건 동기 함수가 처리가 끝난 이후에 비동기 처리가 진행되는 것이였고, async 함수 안에서 await 변수를 만나면 그 이후의 내용들은 실행 순서가 모두 후순위로 빠지게 되는 것이다.
그렇기 때문에 async 함수로부터 return 값을 받는 변수는 반드시 await를 통해 값을 할당해야 동기 함수처럼 사용할 수 있는 것이다.
덕분에 서버 연결이나 api 호출에 대한 오류는 앞으로 적어질 것 같은 느낌이 들었다.
또 오늘 개인 과제가 시작되는 날이였는데
onSubmit이라는 이벤트를 사용해야되는데, 이게 form 태그를 이용해야해서 꽤 복잡했다.
나는 '결국 사용자 input은 onChange로 구현하는 데 왜 굳이..'라는 생가이 들었다.
후에 조원 분이 form 태그에서 action을 통한 이벤트 구분을 할 수 있다라는 얘기를 해주셔서 도움을 받을 수 있었다.
그래서 오늘 조금 진이 빠진 느낌이다.
사실 form으로 변수들을 전달해야되는 것처럼 느껴져서 코드를 갈아엎고,
해당 태그의 value에 접근하는 방법 찾고,
또 버튼 이벤트 구분하는 방법도 찾고, 이래서 뱅뱅 돌다보니까
프로젝트 진행이 더딘 느낌이다.
실행 컨텍스트는 복잡하지만 매우 중요한 내용
React는 매우 편한다
정해진 정답이 없으니까 나만의 방식으로 진행해보자
