안녕하세요 :3 "코딩알려주는누나"님! 제가 이번에 학교 친구들이랑 프론트엔드 개발 입문자들이 알아야 할 웹 상식 페이지들을 정리하는 사이트를 만들고있어요..! 각 주제 소개글 아래에 추천 유튜브 영상 탭을 만들어, 추천영상으로 이동할 수 있는 컴포넌트를 만드는데, 이번 호이스팅 관련 주제에서 "코딩알려주는누나"님의 영상을 정말 도움이 많이 될 것 같아 추천 영상으로 소개드려도 될지 허락을 구하고자 댓글을 작성하였어요! (물론 상업용아니에요..!!!) 혹시 "코딩알려주는누나"님의 영상을 추천영상에 올려놔도 될까요?ㅡ?
@@seongyongchoi1227 금융쪽의 마이데이터 프로젝트중인데 해당 바벨js를 모르고 계시는건 아닌거 같은데 새로운거를 쓰는데 있어서 기존코드에 영향을 줄까 걱정해서인지 뭔가 보수적인거 같더라구요 제가 뭔가 제안하기엔 저도 아직 초보이고 해서 그냥 프로젝트에 제 코드를 맞추고 있어요..ㅜ
2:40 이 때 특이한 특징이라고 설명해주시는 부분이 자바스크립트의 실행 컨텍스트에 대한 간략한 설명입니다. 실행 컨텍스트란 실행 가능한 코드가 실행되기 위해 필요한 환경입니다. 그 환경을 구성하는 과정에서 설명해주시는 호이스팅이 일어나는 거구요. 이야기에 살을 붙히자면... 사실 정확히 호이스팅이란건 선언을 최상단으로 끌어올리는 것이 아니라 그러한 동작을 하는 것처럼 보이는 "현상" 입니다. 아까 말씀드린 실행 컨텍스트를 구성하는 과정에서, 코드를 실행하기 전, 지금 어떤 변수/함수가 선언 되었는지 확인을 하여 해당 스코프에 등록을 합니다. 이게 코드 실행 전에 일어나다보니 최상단으로 끌어올려지는 듯이 보이는 것이구요. 다만, var 는 선언 및 초기화가 동시에 이루어지기 때문에 오류가 나지 않는 것이고, let 과 const 는 선언과 초기화가 분리되어 있기 때문에 선언만 되어 있어 오류가 나는 것입니다. 부연 설명을 하자면, 변수 생성에는 크게 3단계가 있는데, 선언, 초기화, 할당입니다. 1. 선언은 실행 컨텍스트에 변수를 등록하는 겁니다. 위에서 말한 코드 실행 전에 이루어지죠. 2. 초기화는 변수를 위한 메모리를 확보하고, 변수를 undefined 로 초기화하는 것입니다. var는 선언과 동시에, let과 const는 실제 코드 내에서 변수 선언문에 도달했을때 이루어집니다. 3. 할당은 undefined 로 초기화 된 변수에 실제 값을 할당 하는 것이죠. 초기화 단계가 이루어지지 않으면, 변수를 위한 메모리 공간이 아직 확보되지 않았기에 참조 할 수 없어, 참조 오류를 내뱉게 됩니다. 참고로 const 는 선언과 동시에 반드시 할당을 해줘야 오류가 나지 않습니다! 추가적으로 var는 호이스팅이 일어나 선언 및 undefined 로 초기화 되어 참조 가능해지지만, let/const 는 오류가 나는걸 보면 호이스팅이 일어나지 않는 듯 보이지만 실제로 호이스팅이 일어나고 있습니다! 다만 초기화 지점 전에 참조하려하면 참조오류가 나는 것이지요. 그리고 참조오류가 나는 구간인 스코프 시작 지점부터 초기화 지점까지의 구간을 일시적 사각지대(Temporal Dead Zone; TDZ)’라고 합니다. 주절주절 제 머리 속 내용 정리하듯 메모장처럼 쓰긴 했는데 저도 면접 질문받으면 이렇게 대답하지 않을까 하는 생각에 길어졌네요.. 혹시 틀린 부분 있으면 지적 부탁드립니다!
var은 변수 라는 뜻의 variable의 약자인 건 알고 있었는데 개발 경험이 오래되었어도 let이라는 건 처음 알았네요. 덕분에 제 스스로를 반성하게 되었습니다. let으로 var의 중복 오류를 잡을 수 있다는 좋은 정보를 알게되었네요. 정말 감사합니다. 아 그리고 const는 변수를 상수화시키는 역할을 한다고 하셨는데 자바의 static과 비슷한 의미라고 이해하면 될까요?