UP

생성자 (Constructor) 클래스로부터 객체를 생성할 때, 호출되며 '객체의 초기화를 담당'. // 생성자(Constructor) constructor(fullName: string, age: number, jobTitle: string, hourlyRate: number, workingHourPerWeek: number) { this.fullName = fullName; this.age = age; this.jobTitle = jobTitle; this.hourlyRate = hourlyRate; this.workingHourPerWeek = workingHourPerWeek; } app.ts class Employee { // 프로퍼티(Property) private _fullNa..

객체지향 프로그래밍 연관된 변수와 함수들을 한 덩어리로 묶어서 구조화하여 표현하는 프로그래밍 스타일 어플리케이션을 실제 세상에 존재하는 객체와 같은 단위로 쪼개고 객체들이 서로 상호 작용함으로써 시스템이 동작하는 것 손님이 물건을 장바구니에 담아서 주문, 결제한다. → 밑줄 친 것들이 하나의 객체가 되는 것 클래스(Class) 객체(object)들은 클래스를 통해서 만들어 진다. 클래스는 객체의 뼈대, 설계도, 생산틀 클래스 속에서 정의된 함수들은 클래스 내 정의된 변수들에게 접근 가능(this 키워드)하고 상대적으로 적은 매개변수를 가진다. 매개변수가 적을 수록 함수를 더 쉽게 사용할 수 있고 쉬운 유지보수가 가능하므로 깨끗한 코드가 된다. 프로퍼티(Property) : 클래스 내에 정의된 변수 메소드..

함수의 타입 명시 함수의 반환(Return) 타입 function sendGreeting(message, userName): void { // void(아무 것도 반환하지 않음) console.log(`${message}, ${userName}`); } sendGreeting('Hello', 'Mark'); void 외에도 다양한 타입으로 반환 타입 지정 가능 function sendGreeting(message, userName): string { return 'Hello, Mark'; } function sendGreeting(message, userName): string[] { return ['Hello', 'Mark']; } function 함수이름 (매개변수1, 매개변수2, ...): 함수의 ..

Any 타입 어떠한 타입이든 모두 가능 타입을 명시할수록 개발자의 의도를 명확하게 코드화 할 수 있고 타입에러를 컴파일 시 잡아낼 수 있기 때문에 코드를 효과적으로 유지보수 할 수 있다. 그러므로 any 타입은 지양하는 것이 좋다. 변수의 타입을 모를 경우에만 사용 let someValue: any = 5; // Any 타입 someValue = 'hello'; someValue = true; 유니언 타입 제한된 타입들을 동시에 지정하고 싶을 때 사용(파이프라인 이용) let price: number | string = 5; // 유니언 타입 price = 'free'; price = true; // 에러 price는 숫자나 문자 타입만을 지정할 수 있으므로 boolean 타입은 에러를 발생 타입 별칭(..

열거형(Enum) 연관된 아이템들을 함께 묶어서 표현할 수 있는 수단 숫자 열거형(Numeric Enum) 일반적인 enum일 경우 JS로 컴파일했을 때, 타입스크립트가 enum에 선언된 순서에따라 0부터 숫자를 할당 app.ts enum GenderType { Male, Female, genderNeutral } app.js var GenderType; (function (GenderType) { GenderType[GenderType["Male"] = 0] = "Male"; GenderType[GenderType["Female"] = 1] = "Female"; GenderType[GenderType["genderNeutral"] = 2] = "genderNeutral"; })(GenderType ||..

인터페이스 (Interface) 객체를 구조화 실제 구현이 들어있지 않고 상호 간에 정의한 조건이나 규약을 의미 객체의 스펙(속성과 속성의 타입) 함수의 파라미터 함수의 스펙(파라미터, 반환 타입 등) 배열과 객체를 접근하는 방식 클래스 타입스크립트에 명시한 인터페이스는 컴파일 후 자바스크립트에 표시되지 않음 타입스크립트로부터 다양한 정보를 제공받아 코드를 작성하는데 도움을 받는 것이므로 굳이 자바스크립트에 표시할 필요는 없기 때문 인터페이스 사용 예시 1 Student 인터페이스 생성 interface Student { readonly studentID: number; studentName: string; age: number; gender: ..

타입 명시(Type Annotations) 변수를 선언할 때, 변수 값의 타입을 명시함으로써 변수 값의 데이터 타입을 지정 예시 let x:string = 'Im String'; 타입 명시 예시 1 app.tsstudentID의 값을 12345에서 'hello'로 바꾸면 명시한 타입에 맞지 않는다는 에러를 띄운다. let studentID:number = 12345; //let studentID:number = 'hello'; // 에러 let studentName:string = 'Jenny Kim'; let age:number = 21; let gender:string = 'female'; let subject:string = 'Javascript'; let courseCompleted:boolean..

타입 추론(Type Inference) 타입스크립트는 타입 표기가 없는 경우 코드를 읽고 분석하여 타입을 유추 Static Typing(정적 타이핑) 타입을 선언하고 타입에 맞는 값만이 할당 or 반환되어야 한다. 타입 추론 예시 1 app.ts let a = 5; a = 'hello'; 에러 발생! app.ts:2:1 - error TS2322: Type 'string' is not assignable to type 'number'. 2 a = 'hello'; ~ 변수 a가 이미 숫자타입으로 선언되어 있기 때문에 문자타입으로 재선언하는 것은 불가능 같은 타입으로는 선언 가능 ex) a = 10 타입 추론 예시 2 app.ts let student..

타입스크립트 특징 변수 값에 데이터 타입 지정 가능 객체지향적 프로그래밍 언어인 동시에 컴파일러 컴파일 타임 오류를 잡을 수 있다 타입스크립트를 자바스크립트로 변환해주는 과정이 필요(브라우저는 자바스크립트로 돌아가기 때문) 타입스크립트 환경셋팅 NPM 설치 Node Package Manager 모듈 설치 도구 Node JS의 한 부분 npm으로 Typescript 설치 # cmd npm install -g typescript VS Code 설치 코드 에디터(코드 작성 프로그램) VS Code Extension (확장 프로그램) - 📥설치! Prettier : 코드를 보기 좋고 읽기 쉽게 만듦 ESLint : 코드 품질 도구로 코드 검사 및 잠재적인 문제 알림 Path Intellisense : 로컬파일을..