본문 바로가기

전체 글27

[Javascript 기초] DOM의 이해 및 DOM 선택 https://developer.mozilla.org/ko/docs/Web/API/Document_Object_Model/Introduction DOM이란 Document Object Model로 문서 객체 모델을 말합니다. DOM은 프로그래밍 언어가 DOM 구조에 접근할 수 있는 방법을 제공하여 그들이 문서 구조, 스타일, 내용 등을 변경할 수 있게 돕고, 자바스크립트 같은 스크립팅 언어가 쉽게 웹 페이지에 접근하여 조작할 수 있게끔 연결시켜 주는 역할을 담당합니다. DOM의 탐색 방법에 대해 알아보겠습니다. 1. 자식요소 탐색 2. 형제요소 탐색 3. 부모요소 탐색 1. 자식요소 탐색 1) 부모요소.querySelector() 2) 부모요소.children - 유사배열로 출력 *유사배열 : 배열처럼 .. 2023. 7. 17.
[Javascript 기초] 전개 연산자 전개 연산자는 배열의 요소나 객체를 전개해주는 연산자입니다. 배열이나 객체를 복사하여 여러 개의 배열이나 객체를 병합할 수 있습니다. // 구문 myFunction(...iterableObj); 1. 배열에서의 전개 연산자 // 배열 복사 let colors = ["red", green, "blue"]; let colors2 = ["pink, ...arr"]; console.log(arr2); // ['pink', 'red', 'green', 'blue'] // 배열 병합 let hobby = ["game", "sports", "reading"]; let hobby2 = ["dance", "climbing", "skating"]; let newHobby = [...hobby, ...hobby2]; con.. 2023. 6. 3.
[Javascript 기초] 비구조화 할당(구조 분해 할당) 비구조화 할당(구조 분해 할당) 구문은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있는 표현식입니다. const colors = ["red, green, yellow, blue, black"]; const [color1, color2, color3, color4] = colors; console.log(color1); // red console.log(color2); // green console.log(color3); // yellow console.log(color4); // blue console.log(color5); // black const peopleA = { name : "Tom", age : 23, isFemale : false, hobby : "exercise" } .. 2023. 6. 3.
[Javascript 기초] 숫자 관련 객체 Math 숫자 관련 객체 1. Math.round() 2. Math.pow() 3. Math.sqrt() 4. Math.abs() 5. Math.ceil() 6. Math.floor() 7. Math.min() 8. Math.max() 9. Math.random() 1. Math.round() Math.round(x)는 입력값 x에서 제일 근접한 정수를 반환합니다. (반올림, 반내림) console.log(Math.round(4.3)); // 4 2. Math.pow() Math.pow(x, y)는 x에 y를 제곱한 값을 반환합니다. console.log(Math.pow(2, 4)); // 16 3. Math.sqrt() Math.sqrt(x)는 x의 제곱근을 반환합니다. console.log(Math.sqrt(.. 2023. 5. 31.