본문 바로가기

CSS
31

📌 호이스팅이란? JS 변수 선언의 동작 원리 정리 자바스크립트를 공부하다 보면 꼭 한번은 만나는 개념이 있다. 바로 호이스팅(Hoisting)이다.이 단어만 들으면 어렵게 느껴지지만, 사실 개념은 단순하다.호이스팅은 "끌어올린다"는 뜻 그대로, 자바스크립트가 실행 전에 변수나 함수 선언을 위로 올리는 현상이다.🎬 호이스팅은 실행 전에 벌어지는 일자바스크립트는 코드를 실행하기 전에 한 번 스캔을 한다.이때 변수 선언(var, let, const)과 함수 선언이 있는지 확인하고, 메모리에 미리 등록해둔다.그래서 코드보다 먼저 선언이 처리된 것처럼 보이게 된다.이걸 바로 호이스팅이라고 부른다.🧪 예제로 이해하는 호이스팅예제 1 – var 변수console.log(a);var a = 10;이 코드는 에러가 날까? 아니다. 결과는 undefined다.왜 그럴.. 2025. 4. 5.
🤖 ChatGPT와 함께 공부하는 JavaScript 5일차 - 간단한 디지털 시계 만들기 미션 데일리 미션으로 시작했는데 이 망할 챗GPT가 며칠내내 에러가 심해져 데일리 코드를 받지 못하는 이슈가 생겼다..!그동안의 기록들을 지우고 정리하는 과정을 거치니 조금 나아지긴했지만 데일리 코드를 꾸준히 받지 못할 수도 있을 것 같다..아무튼 그래서 오늘의 미션은 간단한 디지털 시계 만들기 미션을 주었다.🚩 내가 작성한 코드const time = docuument.getElementById("time");let timetId;timetId = setInterval(function(){ const p = document.getElementById("time"); const now = new Date(); let year = now.getFullYear() let month = now.. 2025. 4. 3.
🤖 ChatGPT와 함께 공부하는 JavaScript 4일차 - 이미지 숨기기/보이기 토글 기능 미션 오늘은 이미지 숨기기/보이기 토글 기능이다. 조금은 쉬운 미션으로 보이나 if문 활용에 대한 거라 걱정이다.그리고 항상 addEventListener 기능을 쓸때 안을 어떻게 써야할지 아직 막막하다..ㅠㅠ많이 써봐야 알수 있겠지..언제쯤 그날이 올까..🥹🚩 처음 작성한 코드const image = document.querySelect("#image");const button = document.querySelect("#button");botton.addEventLisnter("click", function(){ if(image.style.display === 'none'){ image.style.display = 'block'; }else{ image.style.d.. 2025. 3. 29.
🤖 ChatGPT와 함께 공부하는 JavaScript 3일차 - 텍스트 컬러 변경 미션 오늘 JS 미션은 입력창에 입력한 색상으로 텍스트의 색상을 변경하는 기능을 구현하는 것이었다. 순차적으로 구현하다가 간단한 실수로 인해 문제가 발생했다.🚩 내가 작성한 코드const text = document.querySelector('text');const input = document.querySelector('#colorInput');const button = document.querySelector('#changeColor');botton.addEventListener("click", function(){ let color = input.value; console.log(color); text.style.color = color;});📍 발생한 문제클래스 선택자(.)를 사용하.. 2025. 3. 27.

최근댓글

최근글

skin by © 2024 ttuttak

티스토리툴바