JavaScript/study 35

[javascript] var, const, let 등 변수 다루기 , TDZ

변수란? 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름. 값을 저장하고 창조하는 메커니즘으로, 값의 위치를 가리키는 상징적인 이름이다. ⚠️ 변수의 5가지 주요 개념 -변수 이름 : 저장된 값의 고유 이름 -변수 값 : 변수에 저장된 값 -변수 할당 : 변수에 값을 저장하는 행위 -변수 선언 : 변수를 사용하기 위해 컴퓨터에 알리는 행위 ( ex. const a,var a,let a ) -변수 참조 : 변수에 할당된 값을 읽어오는것 ( ex. console.log(a)) var -var는 오래된 버전의 자바스크립트에서 변수를 선언하는 데 사용됨 -var로 선언된 변수는 함수 스코프(function scope)를 가지며, 함수 내에서 선언된 변수는 함수..

JavaScript/study 2023.05.22

[js] Math 메서드 / 소수점 버림, 올림, 반올림 등 number 소수점 처리

js 소수점 처리 1. 소수점 버림 (Math.trunc) const truncatedNum = Math.trunc(num); 2. 소수점 올림(Math.ceil) const roundedUpNum = Math.ceil(num); 3. 소수점 반올림(Math.round) const roundedNum = Math.round(num); 4. 소수점 내림(Math.floor) const roundedDownNum = Math.floor(num); 이외에도 toFixed() 메서드나 Intl.NumberFormat() 객체를 사용하여 소수점을 처리할 수 있다. 다만 이 경우 반환값이 문자열이므로, 숫자로 변환하기 위해서는 parseInt()나 parseFloat() 함수를 사용해야 한다. * 소수점 자리수 고..

JavaScript/study 2023.05.09

window.addEventListener("load", function) / window.addEventListener("DOMContentLoaded", function) 차이

window.addEventListener("load", function) load 이벤트는 모든 리소스가 완전히 로드되었을 때 발생 이는 HTML 문서, CSS 스타일시트, 이미지 등의 모든 리소스가 다운로드되고 렌더링되었을 때를 의미합니다. 따라서 load 이벤트는 페이지가 완전히 준비된 후에 코드를 실행할 때 사용됩니다. window.addEventListener("DOMContentLoaded", function) 반면에, DOMContentLoaded 이벤트는 HTML 문서가 로드되고 파싱되어 DOM 트리가 완성된 후에 발생합니다. 이는 CSS 파일, 이미지 및 기타 리소스의 로드가 완료되기를 기다리지 않고도 스크립트를 실행할 수 있음을 의미합니다. 따라서 DOMContentLoaded 이벤트는..

JavaScript/study 2023.03.28

[javascript] DOM 조작 / Output , html 출력 (innerHTML 외)

innerHTML => HTML 태그를 포함한 문자열을 설정하거나 반환할 수 있음 => 동적인 웹 페이지 구현 가능 사용예시 코드 const element = document.getElementById("example"); // innerHTML 사용 element.innerHTML = ` Hello World! This is an example of using innerHTML. `; let temp_html = ""; // 배열의 각 요소에 대해서 작업을 수행 items.forEach((item) => { // 각 요소에 해당하는 HTML 코드를 temp_html 변수에 추가 temp_html += `${item}`; }); // 결과적으로 생성된 HTML 코드를 화면에 출력하거나 변수에 저장할 수 ..

JavaScript/study 2023.02.05

[js] DOM 요소 셀렉터

getElementById This is my element const element = document.getElementById('myElement'); console.log(element.innerHTML); // "This is my element" getElementById는 id 속성 값을 사용하여 해당 요소를 선택합니다. 선택된 요소가 하나뿐이므로 반환되는 값은 단일 요소입니다. getElementsByClassName This is my first element This is my second element const elements = document.getElementsByClassName('myClass'); console.log(elements.length); // 2 console..

JavaScript/study 2022.09.09