본문 바로가기

TypeScript19

[TypeScript] 오버라이딩(Overriding), 오버로딩(Overloading) 🏷️ 요약오버라이딩 : 상속받은 메서드를 재정의 하는 것 오버로딩 : 기존에 없는 새로운 메서드를 추가하는 것구분오버라이딩(Overriding)오버로딩(Overloading)접근 제어자부모 클래스의 메소드의 접근 제어자보다 더 넓은 범위의 접근 제어자를 자식 클래스의 메소드에서 설정할 수 있다.모든 접근 제어자를사용할 수 있다.리턴형동일해야 한다.달라도 된다.메서드명동일해야 한다.동일해야 한다.매개변수 갯수 / 타입동일해야 한다.달라야만 한다.적용 범위상속관계에서 적용된다.같은 클래스 내에서 적용된다.오버라이딩(Overrding)부모 class에 정의된 method를 자식 class에서 재 정의하는 개념입니다.상속받은 부모 method를 무시하고, 새로운 method를 정의하기 위해서 사용합니다. 그리.. 2024. 8. 2.
[TypeScript] 상속(Extends), 추상 클래스(Abstract Class), 인터페이스(Interface) 객체지향 프로그래밍(Object Oriented Programming, OOP)객체지향 프로그래밍(Object Oriented Programming, OOP)은 커다란 문제를 클래스 단위로 나누고 클래스 간의 관계를 추가하면서 코드 중복을 최소화 하는 개발방식이다. 클래스 간의 관계를 추가할 때는 상속이나 포함 관계를 고려하여 추가한다. OOP를 통해 어플리케이션을 개발하면 코드 중복을 상당히 줄일 수 있다. 타입스크립트는 자바스크립트(ES6)에 비해서 OOP를 지원하는 부분이 훨씬 더 많다.🏷️ 요약상속(Extends)클래스는 'extends'를 붙여 상속을 주고 받으며 부모-자식관계의 클래스들을 생성할 수 있다.먼저 부모가 될 클래스를 생성한 뒤, 그 뒤 이를 상속받을 자식 클래스는 class 자식.. 2024. 8. 2.
[TypeScript] 열거형(Enum)타입 열거형(Enum)열거형(enum)타입은 여러개의 값을 나열하는 용도로 사용된다. 값이 모두 숫자인 enum을 숫자형 enum 혹은 숫자 열거형 타입이라고 부르며, 값이 모두 문자열인 enum을 문자형 enum 혹은 문자열 열거형 타입이라고 한다. 그리고 enum은 컴파일 결과 객체가 된다.숫자 열거형(Numeric enums)숫자형 타입에서는 value의 할당을 생략할 수 도 있습니다. 할당을 생략하게 되면 값은 0 부터 차례대로 할당됩니다.enum State { REQUEST, LOADING, DONE, ERROR,}console.log(State.REQUEST); // 0문자열 열거형(String enums)문자형 타입에서는 값의 할당을 해주어야 합니다. 만약에 빼먹으면 숫자형 타입으로 인식이.. 2024. 7. 31.
[TypeScript] 클래스(Class) 클래스(Class)클래스는 객체를 생성하기 위한 템플릿으로서,해당 클래스로부터 생성된 객체를 인스턴스라고 한다.클래스를 사용하면 데이터와 해당 데이터에 대한 메서드를 하나로 묶어서사용자 정의 타입을 생성할 수 있다.클래스 구성요소(Members)필드(field)생성자(constructor)메소드(method) 📝 클래스 선언         클래스 몸체에 클래스 프로퍼티를 사전 선언class 클래스명 { [private | protected | public] property name[?]: property type[...]}class 클래스명 { 멤버필드명: 타입; constructor(매개변수명: 타입) { this.멤버필드명 = 매개변수명; } 메소드명(this: 클래스명) { .. 2024. 7. 31.
[TypeScript] 타입스크립트 예외 처리 Errors (Try, Catch, Finally, Throw) 📖 예외 처리(exception handling)코드 실행 중에 예기치 못한 에러가 발생했을 때, 코드의 실행 흐름을 복구할 수 있는 기능⏳ 오류의 종류1. 코드가 실행조차 되지 않는 오류    프로그램 실행 전에 발생하는 오류를 구문 오류(syntax error)라고 부름.  2. 코드 실행 중간에 발생하는 오류    프로그램 실행 중에 발생하는 오류를     예외(exception) 또는 런타임 오류(runtime error)라고 부름.📚 예외 처리try catch finallytry..catch는 오직 런타임 에러에만 동작 try { // 1) 먼저 실행된다. // 2) 에러가 없으면 catch 구문은 무시된다. // 3-1) 에러가 있으면 실행이 중단되고, catch 블록으로 error객.. 2024. 7. 26.
[TypeScript] 타입스크립트 함수(Function) 함수(Function)함수는 여러 문장들을 묶어서 실행하는 기능을 갖는데,함수를 여러번 호출하여 사용할 있기 때문에함수는 재사용 가능한 코드 블럭의 기본 단위로 볼 수 있다.함수 기본 구조TypeScript에서 함수는 function 키워드를 사용하여 정의는데, function 뒤에 함수명을 적고 함수명 뒤 괄호 안에 입력 파라미터들을 나열한다. 입력파라미터는 그 타입을 명시할 수도 있으며, 함수의 리턴 타입 또한 입력 파라미터 뒤에 : 을 찍은 후 리턴 타입을 명시할 수 있다.  📝 함수 형태// ▶ 함수function 함수 (인자:타입) : 리턴타입 {}// ▶ 화살표 함수const 변수명 = (인자 : 타입) : 리턴타입 => {}function 함수명(매개변수1: '매개변수1 타입', 매개변수2.. 2024. 7. 26.
[TypeScript] 타입 별칭(Type Alias), 인터섹션 타입 (Intersection Type), 맵드 타입(Mapped type) 타입 별칭(Type Alias)타입 별칭은 새로운 타입을 정의하며, 특정 타입이나 인터페이스를 참조할 수 있는 타입 변수를 의미한다. 📝 타입 별칭(Type Alias) 형태type 별칭 = 타입; 👉 타입 정의type Fruits = { name: string; emoji: string; amount: number;}; 👉 타입 사용        기본 type처럼 변수명 뒤에 : 타입명을 붙여서 선언한다.const pineapple: Fruits = { name: 'pineapple', emoji: '🍍', amount: 3,};다음과 같이 빈 객체를 해당 타입으로 지정하고, 후에 값을 할당할 수도 있다.const coconut = {} as Fruits;coconut.name = '.. 2024. 7. 22.
[TypeScript] 타입스크립트 타입(자료형) ✍️ Summary타입스크립트 자바스크립트 타입TypeJavaScriptTypeScript내용NumberOO숫자(정수, 실수, Infinity, NaN)StringOO문자열작은따옴표('), 큰따옴표("), 백틱(`)BooleanOOtrue / falseNullOO값이 없는 상태UndefinedOO값이 할당되지 않은 상태SymbolOO고유하며 수정 불가능한 데이터 타입 (주로 객체 프로퍼티의 식별자로 사용되며 ES6에서 추가)ObjectOO객체형(참조형)ArrayXO배열TupleXO고정된 요소의 수만큼의 자료형을미리 선언 후 배열로 표현(갯수와 자료형이 고정된 배열)UnionXO변수의 값이 여러 타입을 가지는 경우 타입 사이에 파이프( | ) 기호를 사용하여 정의EnumXO열거형 (숫자 값 집합에 이름을 .. 2024. 7. 22.
[TypeScript] TypeScript 개발환경 세팅하기 👉 선행작업이 필요합니다.이에 대한 방법은 아래 링크를 참고해 주시기 바랍니다.https://creative103.tistory.com/187 [NodeJS] Node.js 환경에서 TypeScript 실행환경 세팅하기Node 설치 (LTS)Node.js는 Chrome V8 JavaScript 엔진으로 빌드된 JavaScript 런타임입니다. https://nodejs.org/en/ Node.js — Run JavaScript EverywhereNode.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.nodejs.org 프로creative103.tistory.com🗂️ 새 작업공간 폴더 생성🗂️ 기존 파일 - 복사해서 가져오기".. 2024. 7. 19.
728x90
반응형