현우의 개발상자

Findings (배운 점) JS getAttribute HTML 요소의 속성 값을 가져오는 JavaScript 메서드이다. 예를 들면, 이미지 태그 는 "src"라는 속성을 가지고 있는데, "getAttribute" 메서드는 이러한 속성 값을 JavaScript 코드에서 읽어올 때 사용된다. setAttribute HTML 요소의 속성 값을 설정하는 JavaScript 메서드이다. 예를 들어, 링크 태그 는 "href"라는 속성을 가지고 있는데, setAttribute 메서드는 이러한 속성 값을 JavaScript 코드에서 변경하거나 추가할 때 사용된다. 클릭하세요 removeAttribute HTML 요소에서 속성을 제거하는 JavaScript 메서드이다. 속성 제거 className HTML 요소의..

Apply (적용) JS 0 - + * { box-sizing: border-box; margin: 0; padding: 0; } body { display: flex; justify-content: center; margin-top: 200px; } #myNumber { font-size: 100px; } .btnBox { display: flex; gap: 10px; } .a { display: flex; justify-content: center; align-items: center; width: 50px; height: 50px; font-size: 50px; } .color-btn { width: 30px; height: 30px; border: none; cursor: pointer; marg..

8월에 진행했던 일들을 정리하고, kpt회고 방식을 적용하여 이번달의 잘한 점, 못한 점을 파악하고 이를 통해 다음 달에는 더 나은 방법으로 어떻게 공부할지를 적었다. KPT 회고란? https://brunch.co.kr/@jinha0802/35 KPT 회고란 무엇인가? 스타트업에서 KPT 회고는 언제 필요하며, 왜 해야 하는가? | 1. KPT 회고란? KPT회고는 다양한 회고 방법론 중 하나이다. Keep, Problem, Try의 약자로 회고 내용을 세 가지 관점으로 분류하여 회고를 진행 brunch.co.kr 이번 달에 난 뭘 했지? 🤔 수업 잘한 점은 수업을 통해서 이해하지 못한 부분과, 추가적으로 알고 싶은 내용에 대해 구글링과 인강을 통해 충족했다. 못한 점은 규칙적인 생활을 했었는데, 개인..

Findings (배운 점) JS window 웹 브라우저 창을 나타내는 전역 객체이다. 웹 페이지를 웹 브라우저에서 열면, 그 페이지는 window 객체 안에서 실행되며, 페이지 내에서 모든 스크립트와 코드가 접근할 수 있는 전역적인 콘텍스트 역할을 한다. 🙌 전역적인 콘텍스트는 프로그램의 가장 바깥쪽 범위, 즉 어떤 함수 안에도 포함되지 않은 최상위 범위를 말한다 console.dir 개발자가 자바스크립트 코드를 작성하면서 만든 객체의 내용을 좀 더 편하게 볼 수 있게 도와주는 도구이다. 이 도구를 사용하면 객체 안에 어떤 정 보가 들어있는지, 그 정보들이 어떻게 구성되어 있는지를 트리 모양으로 펼쳐서 보여준다. 이렇게 해서 객체의 내부를 더 잘 파악하고 문제를 해결하거나 코드를 개선하는 데 도움을 ..

JS push() 원본 배열의 마지막 요소 다음에 새로운 요소를 추가하고, 그 배열의 새 길이를 반환한다. reverse() 배열의 요소들을 역순으로 뒤집어주는 역할을 한다. 즉, 배열의 첫 번째 요소가 마지막으로, 두 번째 요소가 마지막의 바로 뒤 자리로, 그리고 마지막 요소가 첫 번째로 옮겨진다. // 원래 배열 let fruits = ['apple', 'banana', 'cherry', 'date']; // reverse() 메서드 사용 fruits.reverse(); console.log(fruits); // 출력: ['date', 'cherry', 'banana', 'apple'] join() 배열의 모든 요소들을 하나의 문자열로 결합하는 역할을 한다. 이때 각 요소들은 구분자(separator..

Findings (배운 점) JS while 문 while 문은 특정 조건이 참일 동안 반복적으로 코드 블록을 실행하는 제어 구문이다. while 문의 기본 구조 while (조건) { // 조건이 참일 경우 실행될 코드 블록 } 여기서 조건은 반복이 계속되는 동안 평가되는 불리언(Boolean) 표현식이다. 만약 조건이 참(true)이면, 코드 블록 내의 명령문이 실행된다. 이후에 다시 조건이 평가되며, 조건이 여전히 참이라면 코드 블록이 다시 실행됩니다. 이 과정이 조건이 거짓(false)이 될 때까지 반복된다. 예시 let count = 1; while (count

Findings (배운 점) JS slice() slice(start[, end]) slice()는 배열에서 원하는 부분을 잘라내어 새로운 배열을 만들어 반환하는 역할을 한다. slice()를 사용하 면 원본 배열을 변경하지 않고 특정 범위의 요소를 추출하여 새로운 배열을 생성할 수 있다. const originalArray = [1, 2, 3, 4, 5]; const slicedArray = originalArray.slice(1, 4); const allSliceArray = originalArray.slice(); console.log(slicedArray); // 출력: [2, 3, 4] console.log(allSliceArray); // 출력: [1, 2, 3, 4, 5]; slice() 첫..

Findings (배운 점) JS Object 객체(Object)는 데이터와 그 데이터를 조작하는 함수들을 하나의 그룹으로 묶은 것이다. 객체는 다양한 형태의 정보를 저장하고 조작할 수 있도록 도와준다 객체는 중괄호 {}로 둘러싸여 있으며, 내부에는 "프로퍼티"와 "메서드"라고 불리는 키-값 쌍들이 포함됩니다. 프로퍼티는 객체의 데이터를 나타내고, 메서드는 객체에서 수행할 수 있는 작업을 정의한 함수입니다. property 설명 1. property name : property value (key(키) : value(값)) 2. property name 따옴표 ('') 생략 가능 첫글자 문자, 밑줄, 달러 사용가능 // 띄어쓰기, 하이픈(-)을 사용하려면 따옴표를 써줘야 한다 ex) "h i" 3. pr..