배열, 객체는 다량의 데이터를 다룰 수 있는 데이터 타입임 배열 : 순서(index)가 있는 값(element) Method : 기능을 가짐 Property(속성) : 변수로 사용할 수 있음 arr.length : '배열의 길이' 반환(Property) Array.isArray() : 인풋값이 배열인지 확인하여 'Boolean(T/F)'로 반환 arr.indexOf() : 배열 내부에 인풋값이 있는지 확인하여 있으면 'index' 반환, 없으면 '-1' 반환 arr.includes() : 배열 내부에 인풋값이 있는지 확인하여 'Boolean(T/F)'로 반환 Array.from() : 인풋값이 문자열인 경우, 알파벳 하나하나가 element로 이루어진 '배열' 반환 인풋값이 유사배열객체(키가 인덱스)인 ..
terminal 터미널 ctrl alt t prompt 프롬프트 터미널의 입력줄(한줄) ctrl c 터미널 강제 종료 CLI 명령어 pwd : print working directory 현재 위치 mkdir : make directories 새로운 폴더 생성 ls : list 현 위치의 폴더/파일 리스트 출력 -a all 숨긴 폴더/파일까지 모두 출력 -l 폴더나 파일의 형식(포맷)을 모두 표현 -al, -la 순서 상관 없음 * 참고 파일 타입 10자 1 d, -, l (directory, file, symbolic link) 2-4 소유자 권한 r, w, x(-) (read읽기, write쓰기, excute실행, 권한 없음) 5-7 그룹 사용자 r, w, x(-) 8-10 그 외 사용자 r, w, x..
element 찾기 Document.querySelector('셀렉터') 셀렉터에 해당하는 요소 찾기 Document.getElementById(id) 일치하는 id 찾기 element.className class 이름을 문자열로 반환 element.classList() class 이름을 DOMTokenList로 반환(공백으로 구분된 토큰 집합) class 추가하기 element.className += ' 이름' (공백 필요) element.classList.add('이름') (공백 불필요) class 삭제/수정 element.classList.remove() 제거하기. ','로 구분하여 여러값 한번에 삭제 가능 DOMTokenList.replace(A, B) A를 B로 변경 DOMTokenList.to..
css 속성 css 변수 root css파일에 :root 가상클래스를 만들어 유지보수를 손쉽게 할 수 있다.(색상, 폰트) :root { --color-black: ##0D0D0D; } vmin Viewport의 가로와 세로 길이 중 짧은 길이 vmax Viewport의 가로와 세로의 길이 중 긴 길이 z-index z축 정렬. 형제 요소의 z-index끼리 비교하여 숫자가 크면 앞 작으면 뒤에 배치 - auto 기본값 - -1(음수) 가장 아래(부모 요소 뒤로 감) filter - blur() 블러 - brightness() 밝기 - contrast() 대비 - drop-shadow() object에 그림자 주기 - grayscale() 흑백 - hue-rotate(0deg~360deg) 색상 변경 -..
와이어프레임(Wireframe) : 와이어로 설계된 모양 단순한 선이나 도형으로 웹/앱의 인터페이스를 시각적으로 묘사한 것 레이아웃과 구조를 보여주는 용도 목업(Mock-up) : 실제 작동하는 모습과 동일하게 하드코딩 와이어프레임> 목업> JavaScript 이 단계를 따르지 않으면 설계도 없이 건물을 짓는 것과 같다. Flexbox 속성 * 부모요소에 적용 display: flex; flex-direction 정렬축 정하기 - row 가로 정렬(기본값) - column 세로 정렬 - row-reverse 가로 역순 정렬 - column-reverse 세로 역순 정렬 flex-wrap 줄 바꿈 설정하기 : 하위 요소 크기가 상위 요소 크기를 초과하면 줄바꿈을 할지 여부 설정 - nowrap 줄바꿈하지 ..
