타입스크립트의 타입 별칭 & 타입 추론에 대해 알아봅시다~! 타입 별칭 새로운 이름으로 기존의 타입을 참조하는 것을 의미한다. 타입 별칭을 이용하여 타입의 새로운 이름을 만들 때 키워드 type을 이용하여 작성한다. type MyString = string; let str1: string = 'hello!'; // string 타입처럼 사용할 수 있다. // myString과 string은 동일한 의미 let str2: MyString = 'hello world!'; 타입 별칭 장점 인터페이스나 다른 변수를 정의할 때 타입 별칭으로 정의한 타입을 참조하게 됨으로써 코드를 더 간결하고 가독성 좋게 만들 수 있다. 타입 별칭 단점 타입 별칭은 말 그대로 타입에 새로운 이름을 부여하는 것에서 그치기 때문에 확..
타입스크립트의 인터페이스에 대해 알아봅시다~! 타입스크립트 인터페이스 인터페이스(Interface)는 일반적으로 타입 체크를 위해 사용된다. 인터페이스는 변수, 함수, 클래스에 사용할 수 있다. 인터페이스에 선언된 프로퍼티 또는 메서드의 구현을 강제하여 일관성을 유지하도록 한다. TypeScript의 예약어인 interface를 사용하여 TypeScript 인터페이스를 생성할 수 있다. 변수와 인터페이스 // 인터페이스 정의 interface User { name: string; age: number; } // 변수 user의 타입으로 User 인터페이스를 선언하였다. // 변수 user는 User 인터페이스를 준수하여야 한다. let user : User; // 정상적으로 선언됩니다. user: Use..
타입스크립트의 열거형에 대해 알아봅시다~! TypeScript 열거형 열거형(Enum)은 특정 값의 집합을 정의할 때 사용된다. TypeScript는 문자형 열거형 & 숫자형 열거형이 지원된다. 열거형 정의 방식 enum Color { Red, Green, Blue, } 숫자형 열거형(Enum) 디폴트 값으로 숫자형을 사용 각 값은 자동으로 0부터 시작하여 1씩 증가 수동으로도 값 지정 가능 열거형 값에 대해 산술 연산 수행도 가능 일반적으로 상수 값을 대신하여 사용 enum Color { Red = 1, Green = 2, Blue = 4, } let c: Color = Color.Green; let greenValue: number = Color.Green; let blueValue: number =..
타입스크립트의 연산자 활용 타입에 대해 알아봅시다~! 유니온(Union) 타입 자바스크립트의 OR 연산자(||)와 같이 A이거나 B이다 라는 의미의 타입이다. 예를 들어, number | string 은 숫자 또는 문자열 타입을 의미한다. function logText(text: string | number) { // ... } 유니온 타입을 사용해 TypeScript의 이점을 살리면서 코드를 작성해보자. function printValue(value: number|string): void { if (typeof value === "number") { console.log(`The value is a number: ${value}`); } else { console.log(`The value is a s..
타입스크립트의 함수에 대해 알아봅시다~! ➿ TypeScript 함수 TypeScript에도 함수는 JavaScript와 마찬가지로 기명 함수(named function)와 화살표 함수(arrow function) 등으로 만들 수 있다. 함수 선언 //named function (기명 함수) function add(x: number, y: number):number { return x + y; } //named function (기명 함수) : 추론된 리턴 타입 function add(x: number, y: number) { return x + y; } //arrow function (화살표 함수) let add = (x: number, y: number): number => { return x + y..
타입스크립트의 타입에 대해 알아봅시다~! ➿ TypeScript 타입 1. Boolean(불리언) 타입 let isShow: boolean = true; let isDone: boolean = false; 2. Number(숫자) 타입 let number1: number = 5; let number2: number = 0.7; 3. String(문자열) 타입 let firstName: string = "coding"; let lastName: string = 'kim'; let longString: string = `Kimcoding is a developer. He is 20 years old.` 4. Array(배열) 타입 배열 타입은 기본적으로 하나의 타입만 작성하게 되어 있으며, 타입을 혼용해서 ..
JavaScript는 모든 브라우저에서 보편적으로 지원되는 유일한 클라이언트 측 언어이다. 그렇기 때문에 JavaScript로 웹 애플리케이션의 상호작용이 증가하면서, 웹 애플리케이션이 필요로 하는 JavaScript 코드의 양이 폭발적으로 늘어나게 되었고 이로 인해 JavaScript의 한계가 부각되기 시작했다. JavaScript는 동적 타입이 결정되어 유연하고, 다양한 라이브러리와 프레임워크를 사용할 수 있는 장점이 있지만, 타입의 명시성이 부족하다는 단점이 있다. 따라서 , TypeScript(타입스크립트)는 JavaScript에 정적타입 검사와 클래스 기반 객체 지향 프로그래밍 등의 기능을 추가하여 개발된 언어로, JavaScript가 발전하면서 생긴 단점을 보완하기 위해 등장하게 되었다. ex..
타입스크립트를 쓰기 위해 세팅하는 이유 : Node.js는 TypeScript를 이해하지 못하기 때문에 TypeScript를 JavaScript로 컴파일해줘야 함 1. 새로운 프로젝트 초기화 - 터미널 & 비주얼 스튜디오 터미널 npm init -y 2. 타입스크립트 라이브러리 전역 설치 npm install typescript -g 3. tsconfig.json 파일 생성 최상위 위치에서 tsconfig.json 파일 생성 👇🏻 tsconfig.json 파일안에 코드 삽입 여기까지 진행하면 src 폴더 안의 파일에서 타입스크립트 언어로 된 파일을 작성할 수 있다. { "compilerOptions": { "target": "es6", "module": "commonjs", "sourceMap": tru..
