본문 바로가기
반응형

Frontend/JavaScript10

[JS] console 객체 총 정리(+그림&코드) console 객체브라우저의 디버깅 콘솔에 접근할 수 있는 메서드를 제공하는 객체입니다.window 객체의 프로퍼티이므로, winodw.console에서 window.를 생략하여 console 형태로 사용이 가능합니다.console 객체는 아무 전역 객체에서나 접근할 수 있습니다.window.console.log(‘안녕하세요‘);// window. 생략가능console.log(‘안녕하세요‘); console 객체의 메서드 종류log: 메시지를 아이콘이 없는 컴은색 텍스트로 콘솔창에 출력하는 메서드입니다.warn: 메시지를 아이콘이 있는 노란색 텍스트로 콘솔창에 출력하는 메서드입니다.보통은 경고 메시지를 출력할때 사용합니다.error: 메시지를 아이콘이 있는 빨간색 텍스트로 콘솔창에 출력하는 메서드입니다.. 2025. 2. 14.
[JS] Uncaught TypeError: Assignment to constant variable. 오류 해결 방법 ✅  참고해당 에러 메시지를 정확하게 이해하려면 JavaScript에서 const와 let의 차이점에 대한 이해가 필요합니다.const와 let의 차이점에 대해 잘 모르신다면 🔗그림과 코드로 아주 쉽게 정리한 var, const, let의 차이점을 참고해 주세요.  🚨 Chrome 개발자 도구에서 발생한 에러 메시지Uncaught TypeError: Assignment to constant variable.  ❓에러 발생 이유const 키워드로 작성된 변수를 재할당 하기 때문에 발생한 메시지입니다.const 키워드로 선언된 변수는 재할당이 불가합니다.반면, var와 let으로 선언된 변수는 재할당이 가능합니다.재할당은 변수를 다시 선언할 수 있다는 의미입니다.  ✅ 해결 방법1) const 키워드로 .. 2025. 2. 14.
[JS] HTML, CSS, JavaScript 총 정리(+그림&코드) Web페이지의 구성Web 페이지는 다음 3가지로 구성되어있습니다.HTMLCSSJavaScript  HTML 요소(HTML Element)HTML을 이루는 개별적인 요소입니다.HTML 요소가 합쳐져 하나의 HTML 파일로 구성되어있습니다.  아래 이미지에서 , 등과 같이 (꺽쇠)가 붙은 것들 각각을 HTML 요소라고 부릅니다.참고: HTML 엘리먼트, HTML 요소, HTML Tag는 모두 같은말 입니다.  HTML요소들의 내용, 배치, 모양을 정하기 위해 사용하는 언어입니다."웹의 골격" 이라고 표현 할 수 있습니다. 색상이나 디자인 등의 수정은 불가합니다.참고: HTML은 프로그래밍 언어가 아닌 마크업 언어입니다.  CSS요소들의 색상, 크기 등의 스타일을 설정할 수 있습니다."웹의 외모(외형)" 이.. 2025. 2. 13.
[JS] Promise 동작 방식 : 아주 쉽게 그림으로 정리 ※ 이 글은 Promise의 동작 방식에 초점을 두었습니다. Promise에 대한 정확한 설명 혹은 문법은 캡틴 판교 님의 글을 보시면 매우 도움이 되실 겁니다.Promise란?Promise(프로미스)는 JavaScript 비동기 처리에 사용되는 객체입니다. Promise의 3가지 상태Prmoise의 동작 방식을 알기 전, Promise의 3가지 상태에 대해 필수로 알아야 합니다.Promise는 Promise 객체가 생성하고 종료될 때까지 3가지 상태를 갖습니다.Pending(대기): 비동기 처리 로직이 완료되지 않은 상태Fulfilled(이행): 비동기 처리가 완료되어 프로미스가 결과 값을 반환해준 상태Rejected(실패): 비동기 처리가 실패하거나 오류가 발생한 상태 Promise의 동작 방식🟢 .. 2024. 10. 21.
반응형