A Developing Developer

2022.11.14 내배캠4기 노드트랙 본캠프 시작! 그래서 일단 보류! (계획대로 공부안한게 자랑이다...) 언젠간하겠지...?

상속 : 어떤 클래스가 갖고 있는 유산(속성과 메소드)을 기반으로 새로운 클래스를 만드는 것 class 클래스 이름 extends 부모클래스 이름 { } - 사각형 클래스와 정사각형 클래스(상속) - 상속은 어떤 클래스가 가지고 있는 속성과 메소드를 다른 클래스에 물려주는 형태로 사용 - 부모클래스 : 속성과 메소드를 주는 클래스 - 자식클래스 : 속성과 메소드를 받는 클래스 private 속성/메소드 : 클래스 내부에서만 접근할 수 있는 속성/메소드 - 클래스 사용자가 클래스 속성을 의도하지 않은 방향으로 사용하는 것을 막아 클래스의 안정성을 확보하기 위해 나온 문법 class 클래스 이름 { # 속성이름 # 메소드 이름() { } } - private 속성 사용 (#) 게터(getter) : getO..

객체 지향 패러다임 : 객체를 우선적으로 생각해서 프로그램을 만든다는 방법론 - 객체와 배열 조합하기 - 객체 활용하기 - 객체를 처리하는 함수(1) - 객체를 처리하는 함수(2) - 객체를 생성하는 함수 추상화 : 프로그램에서 필요한 요소만을 사용해서 객체를 표현하는 것 클래스 : 객체를 안전하고 효율적으로 만들 수 있게 해주는 문법 - 클래스 생성 class 클래스 이름 { } 인스턴스 : 클래스를 기반으로 생성한 객체 - 인스턴스 생성 new 클래스 이름() - 클래스 서언하고 인스턴스 생성하기 생성자 : 객체가 생성될 때 호출되는 함수. 클래스를 기반으로 인스턴스를 생성할 때 처음 호출되는 메소드, 속성을 추가하는 등 객체의 초기화 처리를 담당 class 클래스 이름 { constructor ()..

예외 객체 : 예외와 관련된 정보를 담은 객체 속성 이름 설명 name 예외 이름 message 예외 메세지 - 예외 정보 출력하기 throw 구문 : 예외를 강제로 발생시킬 때 사용하는 구문 단순하게 예외를 발생시킨다 -> throw 문자열 조금 더 자세하게 예외를 발생 시킨다 -> throw new Error(문자열) - 예외 강제로 발생시키고 잡기 - 예외 강제로 발생시키기 - 예외 강제로 발생시켜서 사용 유도하기 ============================================================================================ 출처 : 혼자 공부하는 자바스크립트 ================================================..

구문 오류(Syntax error) : 프로그램 실행 전에 발생하는 코드의 문법적인 문제로 발생하는 오류를 의미 예외(exception) : 프로그램 실행 중에 발생하는 모든 오류 예외 처리 : 예외가 발생했을 때 프로그램이 중단되지 않게 하는 처리, 구문 오류는 예외 처리로 처리할 수 없음 - 기본 예외 처리 자바스크립트는 다른 프로그래밍 언어와 비교해서 굉장히 유연해서 예외를 발생할 가능성이 적은 편이다 하지만 예외를 발생하지 않는게 좋은 것이 아니다. 프로그램에 문제가 발생했음에도 불구하고 죽지 않는다면 계속 실행되어서 다른 문제들을 만들 가능성이 있다. 따라서 문제가 발생할 수 있는 부분은 조건문 등으로 처리해 줘야 한다. try catch finally 구문 : try 구문 안에서 예외가 발생하..

이벤트 모델 : 이벤트를 연결하는 방법을 의미 // 이벤트 모델 : 이벤트를 연결하는 방법 // 표준 이벤트 모델 { } // 인라인 이벤트 모델 const listener = (e) => { } 이벤트 객체 : 이벤트 리스너의 첫 번째 매개변수로 이벤트와 관련된 정보가 들어있다. - 키보드 이벤트 1. keydown : 키가 눌릴 때 실행, 꾹 누르고 있을 때도, 입력될 때도 실행 2. keypress : 키가 입력되어있을 때 실행, 웹 브라우저에 따라서 아시아권 문자를 제대로 처리 못할 때 있음 3. keyup : 키보드에서 키가 떨어질 때 실행, 일반적으로 이거 사용 - 남은 글자 수 출력하기 - 키보드 키 코드 사용하기 이벤트 속성 이름 설명 code 입력한 키 keyCode 입력한 키를 나타내는..

DOMContentLoaded : HTML 페이지의 모든 문서 객체(요소)를 웹 브라우저가 읽어들였을 때 발생시키는 이벤트 document.addEventListener('DOMContentLoaded', () => { const h1 = (text) => `${text}` document.body.innerHTML += h1('DOMContentLoaded 이벤트 발생') }) - 문서 객체 가져오기 document.body : 문서의 body 요소를 읽어드릴 수 있다. document.head : 문서의 head 요소를 읽어드릴 수 있다. document.title : 문서의 title 요소를 읽어드릴 수 있다. 이름 선택자 형태 설명 태그 선택자 태그 특정 태그를 가진 요소를 추출한다. 아이디 선택..

속성 존재 여부 확인 : 객체 내부에 어떤 속성이 있는지 확인하는 것, 객체에 없는 속성은 접근하면 undefined 가 나옴 // // 속성 존재 여부 확인하기 const object = { name: '주현진', age : 30, gender : 'man' } // 객체 내부에 속성 있는지 확인 if (object.name === undefined) { console.log('name 속성이 없습니다.') } else { console.log('name 속성이 있습니다.') } if (object.hobby !== undefined) { console.log('hobby 속성이 있습니다.') } else { console.log('hobby 속성이 없습니다.') } // 객체 내부에 속성 있는지 확인..