본문 바로가기

분류 전체보기321

KDT 5th 웹개발자 입문 수업 15일차 1. todo 리스트 해설 createElement() -> setAttribute() -> onclick or addEventListener -> appendChild 순서로 만들어서 붙여주는 형식으로 수행 1-1. input 필드의 값은 value에 들어간다. 그러므로 입력 받은 값을 value로 읽어올 수 있다. 1-2. 체크박스의 체크됨을 확인하기 위해선 checked 프로퍼티로 boolean 확인 1-3. DOM요소에 style 프로퍼티로 직접 접근이 가능하며, 스타일 속성명의 경우 카멜형식(text-decoration -> textDecoration) 으로 접근할 수 있다 1-4. addEventListener 와 onclick 이벤트가 일어나는 대상을 접근하는 방법 addEventListen.. 2023. 2. 15.
KDT 5th 웹개발자 입문 수업 14일차 1. Array 메서드 체이닝 1-1. .split(구분자) 구분자를 기준으로 문자열을 나눈다. 나눠진 문자열들이 배열로 리턴된다. let str = "Hello"; let strArr = str.split(''); console.log(strArr); //[ 'H', 'e', 'l', 'l', 'o' ] 구분자를 '' 문자열 없이 사용해주면, 문자 하나하나가 모두 나눠진다. 1-2. .join(구분자) 구분자를 기준으로 배열을 구분자와 문자열로 합쳐준다. 문자열 사이사이 구분자가 들어간 채로 배열로 리턴된다. let arr = [ 'H', 'e', 'l', 'l', 'o' ]; let str = arr.join(''); console.log(str); //Hello 구분자를 '' 문자열 없이 사용해주면.. 2023. 2. 14.
클린 코드 / 리팩토링 / 시큐어링 클린코드란 가독성이 높은 코드를 의미 가독성을 높이려면 네이밍 오류가 없어야 중복이 없어야 의존성을 최대한 줄여서 클래스 혹은 메서드가 한가지 일만 처리해야 함 주석 사용 들여쓰기와 줄바꿈 일관성 있고 간결한 패턴 얼마나 코드가 잘 읽히는 지, 코드가 지저분하지 않고 정리된 코드인지 나타내는 것이 클린코드이다. 단순하고 직접적이며 특정 목적을 달성하는 방법은 하나만 제공하고, 간단한 추상화를 고려하는 것이 비결 리팩토링이란, 프로그램의 외부 동작은 그대로 둔 채, 내부의 코드를 정리하면서 개선하는 것 코드의 가독성을 높이고 향후 이루어질 유지보수에 큰 도움이 되는 작업이 리팩토링으로 리팩토링 필요한 코드는? 중복 코드 → 캐싱 긴 메서드 거대한 클래스 Switch문 등의 조건문이 복잡한 경우 → 단순화 .. 2023. 2. 14.
KDT 5th 웹개발자 입문 수업 13일차 1. 배열 array 순서가 있는 리스트 [ ] 안에 넣기 배열은 문자 뿐만 아니라 숫자, 객체, 함수 등도 포함이 가능 -> 다른 언어와의 차이점 let arr = [ 1, '2', true, null, undefined ]; // 배열의 선언 1-1. 배열의 접근 배열명[인덱스] 1-2. 배열값 변경 배열명[인덱스] = 값 1-3. length : 배열의 길이(개수) 즉, 배열의 마지막 인덱스는 arr.length - 1이 된다. 1-4. 배열의 마지막에 추가 : push() * 배열의 길이를 리턴해준다. 1-5. 배열의 마지막 제거 : pop() * 제거 해주는 배열의 값을 리턴해준다. 1-6. 배열의 앞에 추가 : unshift() * 배열의 길이 리턴 1-7. 배열의 앞에 삭제 : shift().. 2023. 2. 13.