소개
Typescript는 Microsoft에서 개발한 정적 타입을 지원하는 JavaScript의 상위 집합 언어입니다. Typescript는 JavaScript의 기능을 확장하고 개선하여 개발자들이 더욱 안정적이고 확장 가능한 애플리케이션을 만들 수 있도록 도와줍니다. 이번 블로그 포스트에서는 Typescript의 주요 키워드 중 상위 10개를 예시 코드와 함께 자세히 알아보겠습니다.
1. any
any 키워드는 변수의 타입을 명시적으로 지정하지 않고, 어떤 타입이든 할당할 수 있도록 합니다. 이는 동적 타입 언어인 JavaScript와의 호환성을 유지하기 위해 사용됩니다. 예시 코드를 살펴보겠습니다.
let variable: any = 10;
variable = 'Hello World';
console.log(variable); // 출력 결과: Hello World
2. number
number 키워드는 숫자 타입을 나타냅니다. 예시 코드를 통해 이해해보겠습니다.
let age: number = 25;
console.log(age); // 출력 결과: 25
3. string
string 키워드는 문자열 타입을 나타냅니다. 예시 코드를 통해 이해해보겠습니다.
let name: string = 'John';
console.log(name); // 출력 결과: John
4. boolean
boolean 키워드는 논리적인 참과 거짓을 나타내는 타입입니다. 예시 코드를 통해 이해해보겠습니다.
let isDone: boolean = false;
console.log(isDone); // 출력 결과: false
5. void
void 키워드는 반환 값이 없음을 나타내는 타입입니다. 예시 코드를 통해 이해해보겠습니다.
function sayHello(): void {
console.log('Hello!');
}
sayHello(); // 출력 결과: Hello!
6. null과 undefined
null과 undefined는 각각 값이 없음을 나타내는 타입입니다. 예시 코드를 통해 이해해보겠습니다.
let nullValue: null = null;
let undefinedValue: undefined = undefined;
console.log(nullValue); // 출력 결과: null
console.log(undefinedValue); // 출력 결과: undefined
7. never
never 키워드는 절대 발생하지 않는 값을 나타내는 타입입니다. 예시 코드를 통해 이해해보겠습니다.
function throwError(message: string): never {
throw new Error(message);
}
throwError('Something went wrong!');
8. object
object 키워드는 객체를 나타내는 타입입니다. 예시 코드를 통해 이해해보겠습니다.
let person: object = {
name: 'John',
age: 25
};
console.log(person); // 출력 결과: { name: 'John', age: 25 }
9. array
array 키워드는 배열을 나타내는 타입입니다. 예시 코드를 통해 이해해보겠습니다.
let numbers: number[] = [1, 2, 3, 4, 5];
console.log(numbers); // 출력 결과: [1, 2, 3, 4, 5]
10. tuple
tuple 키워드는 고정된 요소 수와 타입을 가진 배열을 나타내는 타입입니다. 예시 코드를 통해 이해해보겠습니다.
let person: [string, number] = ['John', 25];
console.log(person); // 출력 결과: ['John', 25]
결론
이번 포스트에서는 Typescript의 주요 키워드 중 상위 10개를 예시 코드와 함께 알아보았습니다. 각 키워드의 개념과 예시 코드를 통해 더욱 자세히 이해할 수 있었을 것입니다. Typescript를 사용하면 JavaScript 개발을 더욱 효율적이고 안정적으로 할 수 있으므로, 이러한 키워드들을 잘 숙지하고 활용하는 것이 중요합니다.
'FrontEnd > TypeScript' 카테고리의 다른 글
아직도 이거 모르니? 예시코드와 함께 알아보는 Typescript React Hook (0) | 2023.06.23 |
---|---|
아직도 이거 모르니? 예시코드와 함께 알아보는 Typescript 타입 정의방법 (0) | 2023.06.23 |
예시코드와 함께 알아보는 타입스크립트 디자인패턴: 옵저버 패턴 (0) | 2023.06.22 |
예시코드와 함께 알아보는 타입스크립트 디자인패턴: 싱글톤 패턴 (0) | 2023.06.22 |
예시코드와 함께 알아보는 타입스크립트 디자인패턴: 팩토리 패턴 (0) | 2023.06.22 |