전체 글

프로그래머스 데브코스

[JavaScript] Map 과 Set

✅ Map 맵은 키에 다양한 자료형 허용 메소드, 프로퍼티 new Map() : 맵 생성 map.set(key, value) : key를 이용해 value를 저장 map.get(key) : key에 해당하는 값 반환 map.has(key) : key가 존재하면 true, 존재하지 않으면 false 반환 map.delete(key) : key에 해당하는 값 삭제 map.clear() : 맵 안의 모든 요소 제거 map.size : 요소의 개수 반환 (배열의 length 역할) let map = new Map(); map.set('1', 'str1'); // 문자형 키 map.set(1, 'num1'); // 숫자형 키 map.set(true, 'bool&#..

프로그래머스 데브코스

[JavaScript] JavaScript의 10가지 코드 트릭

✅ 01. 구조 분해 할당을 이용한 변수 swap let a = 5, b = 10; [a, b] = [b, a] console.log(a,b); // 10 5 배열 구조 분해 할당 ES6에서 배열의 각 요소를 추출하여 변수 리스트에 할당한다. const arr = [1,2,3]; const [one, two, three] = arr; console.log(one, two, three); // 1, 2, 3 객체 구조 분해 할당 객체의 각 프로퍼티를 추출하여 변수 리스트(객체 형태)에 할당한다. 할당 기준은 키 이다. const obj = { firstName : "Minho", lastName : "Hwang" }; const { lastName, firstName } = obj; console.log(..

프로그래머스 데브코스

[모딥다/스터디] 39장. DOM(Documents Object Model)

📚 DOM 브라우저의 렌더링 엔진은 HTML 문서를 파싱하여 DOM을 생성한다. DOM은 브라우저가 이해할 수 있는 자료구조이다. DOM은 HTML 문서의 계층적 구조와 정보를 표현하며, 이를 제어할 수 있는 API(프로퍼티, 메서드)를 제공하는 트리 자료구조이다. HTML 요소는 렌더링 엔진에 의해 파싱되어 DOM을 구성하는 요소 노드 객체(어트리뷰트 노드, 텍스트 노드)로 변환된다. DOM은 노드 객체의 계층적 구조로 구성되고, 상속 구조를 갖는다. 📚 노드 객체의 타입 ✅ 문서 노드 DOM 트리의 최상위에 존재하는 루트노드. document 객체를 가리킨다. 요소, 어트리뷰트, 텍스트 노드에 접근하려면 문서 노드를 통과해야 한다. ✅ 요소 노드 HTML 요소를 가리키는 객체. ✅ 어트리뷰트 노드 H..

프로그래머스 데브코스

[특강] 코딩테스트 문제풀이 꿀팁

✅ 입력 받는 범위에 따라 입력이 100 이하 완전 탐색 백트래킹 입력이 10,000 이하 이중 for문 입력이 1,000,000 이하 힙, 우선 순위 큐 정렬 동적 계획법 위상 정렬 다익스트라 알고리즘(최단거리) 입력이 100,000,000 O(n) 선형시간 입력이 1,000,000,000 이진탐색 ✅ 키워드에 따라 x라는 조건을 만족하는 최대, 최소값 이진트리 계속해서 최대 혹은 최소값을 알아야 하는 경우 힙 어떤 영역을 채워야하는 경우 dfs, bfs

프로그래머스 데브코스

Git & GitHub / init, add, commit, push, pull, clone, fetch, fork, branch

버전 관리가 필요한 이유 개발자 간의 협업을 위해 전체 개발 소스를 공유하면서 개발 파트를 나눌 수 있고, 같은 모듈로 개발하더라도 소스를 공유하며 개발할 수 있기 때문이다. Git 오픈 소스 버전 관리 시스템(VCS : Version Control System) 로컬에서 버전 관리 소프트웨어 개발 및 소스 코드 관리에 사용 git은 본인의 코드와 그 수정내역을 기록하고 관리하도록 돕는 버전 관리 프로그램이며, 로컬에서 프로젝트의 기록을 스스로 관리할 수 있도록 해준다. git을 통해 브랜치를 생성하고 이전 브랜치로 복구, 삭제, 병합이 가능하다. 하지만 로컬 저장소를 사용하기 때문에 다른 개발자와 실시간으로 작업을 공유할 수 없다. Github Git Repository를 위한 웹 기반 호스팅 서비스 ..

프로그래머스 데브코스

[WIL] DAY2,3,4 I Learned / 자바스크립트 기초, 네트워크 기초, 자료구조, 알고리즘

🗓️ day2 (230920) 변수 변수(variable)는 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름을 말한다. const num = 29; // 변수명(식별자) : num // 해당 값의 위치(메모리 주소) : 0012CCGWH80 // 변수 값(저장된 값) : 29 변수명(num)는 변수의 값이 아닌 메모리 주소를 바라보고 있다. 변수명을 사용하면, 자바스크립트 엔진이 변수명과 매핑된 메모리 주소를 통해 메모리 주소에 저장된 값(29)을 반환한다. 변수에 값을 저장하는 것을 할당(assignment), 변수에 저장된 값을 읽어들이는 것을 참조(reference), 변수명을 자바스크립트 엔진에 알리는 것을 선언(declaration)이라 한다...

JavaScript

[CSS] CSS의 기본

📌 CSS의 구성요소 선택자 { 속성 : 속성값; } 선택자: 디자인을 적용할 HTML 영역 속성: 어떤 디자인을 적용할지 정의 속성값: 어떤 역할을 수행할지 구체적으로 명령 📌 CSS 속성 /* 예시 */ h1 { font-size: 20px; /* 폰트 사이즈 */ font-family: sans-serif; /* 글꼴 */ color: blue; /* 폰트 색상 */ background-color: yellow; /* 배경색 */ text-align: center; /* 텍스트 정렬 */ } 📌 CSS 연동 방법 1. Inline Style Sheet: 태그 안에 직접 원하는 스타일 적용 coding 101 2. Internal Style Sheet: 2. Class Selector: 클래스 이름으..

JavaScript

[HTML] HTML와 기본태그

📌 웹을 구성하는 요소 📌 웹 제작 시 고려 사항 웹 표준: 웹사이트를 작성할 때 따라야 하는 공식 표준이나 기술 규격 웹 접근성: 장애의 여부와 상관 없이 모두가 웹사이트를 이용할 수 있게 하는 방식 크로스 브라우징: 모든 브라우저 또는 기기에서 사이트가 제대로 작동하도록 하는 기법 📌 HTML 기본 태그 1. 태그: 정보성을 갖고 있는 이미지를 삽입 (닫힌 태그 X) alt 속성: 웹사이트가 이미지를 출력하지 못했을 경우, 텍스트 정보로 대체 2. 태그: heading의 약자로 제목이나 부제목을 표현 태그는 가장 중요한 정보를 담으므로, 하나의 html 문서에서 한 번만 사용됨 3. 태그: paragraph의 약자로 본문 내용을 표현 Nice to meet you 4. 태그: unordered lis..