내가 원하는 스타일을 화면 전체 페이지에 주고 싶을때 마음대로 되지 않아서 애를 먹었던 적이 많았다. 그냥 무작정 height: 100% 주거나 비슷하게 px 또는 rem으로 크기를 맞춰서 하곤 했는데, 여러 디바이스를 비교하면서 하면 이상해 보이는걸 알았지만 일단 내가 보이는 화면에만 안 보이게 처리하려고 그랬나보다. 별거 아닐 수 도 있지만 기본이라고 생각하는 화면 크기 값 조정. 기록해 놔야지. 📌 % 창이 중심이 아닌 부모 요소의 길이에 맞게 반환한다. 그래서 최상단에서 사용한다면 문제는 없지만 밑의 컴포넌트로 파고 들어갈수록 원하는 결과 값을 얻기 힘들어진다. 📌 vh와 vw vh(viewport height): 화면 기준으로 높이를 뜻한다. vw(viewport width): 화면 기준으로 넓..
📌 자바 스크립트에 지원하고 있는 자료형 ✅ 기본 자료형 (Primitive) ◾ boolean : 논리적인 요소. true와 false값이 있다. ◾ null : 빈 값 ◾ undefined : 값을 할당하지 않은 변수가 가지는 값 ◾ numer : 숫자형으로 정수와 부동 소수점, 무한대 및 NaN (숫자가 아님) 값을 포함한다. ◾ string : 문자열 ◾ symbol (ES6에 추가됨) ✅ 객체 자료형 ◾ object 심볼(Symbol)이란, 다른 값과 중복되지 않는 자료형(unique) 이다. 프로그램에서 이름(변수명)의 충돌 없이 사용하기 위해 활용한다. 일반적으로 심볼 타입은 객체의 프로퍼티 키로 사용된다. 📌 심볼 값 생성 심볼은 전역 함수 Symbol을 사용해서 생성한다. const sy..
1️⃣ for...in for...in 문은 객체의 key를 하나씩 가져온다. const obj = { key1: 'value1', key2: 'value2', key3: 'value3', } for (const key in obj) { console.log(key + ' : ' + obj[key]); } // key1 : value1 // key2 : value2 // key3 : value3 2️⃣ for...of for...of 문은 iterable한 속성을 지닌 String, Array, TypedArray, Map, Set 에서 값을 하나씩 가져온다. 객체는 iterable이 아니기 때문에 사용할 수 없다. const obj = { key1: 'value1', key2: 'value2', key..
📌 예제코드 HTML 삽입 미리보기할 수 없는 소스 📌 코드 높이를 조절할 textarea 요소를 준비해줍니다. textarea { width: 240px; height: 30px; } textarea의 기본 Height를 지정해주고, 이 크기는 JavaScript 코드에서도 사용하게 됩니다. const DEFAULT_HEIGHT = 30; // textarea 기본 height const $textarea = document.querySelector('#textarea'); CSS에서 지정한 Height를 'DEFAULT_HEIGHT' 변수에 저장시켜줍니다. document.querySelector() 선택자로 textarea 요소를 가져와줍니다. // Textarea 자동 높이 조절 $textarea..
