TypeScripit

EunRyeong Park·2022년 9월 23일
0

typescript

목록 보기
1/11

✔️type이 필요한 이유
-개발자의 실수를 최소화
- 명시된 type을 보고 해당 변수의 자료형이 무엇인지 쉽게 이해
=>어떤 용도로 코드가 작성되어 있고 무엇을 의미하는지 파악하기 편리

TypeScripit
Microsoft에서 개발한 오픈소스언어
자바스크립트의 최상위 집합->자바스크립트의 한계 해결

✅TypeScripit를 쓰는 이유

- 동적 타입을 정적으로 선언 가능
let a:number;
a=1;
a='b';//컴파일 시점에서 에러 발생
- 타입 유추를 통한 타입 제어가 가능
- 컴파일 시점에 오류 포착 가능
- 자바스크립트에서 찾을 수 없는 추가 코드 기능 제공

TypeScipt에서 type을 나타내기 위해서 Type Annotation(타입표기)를 사용함

⚫ TypeScipt에서 type 종류

  • 기본 자료형(primitive type)
    - 실제 값을 저장하는 자료형(object❌,reference❌)
// string-문자열을 저장하는 타입
let str: string = "hi";

// Boolean-참/거짓을 저장하는 타입
let isSucceeded: boolean = true;

// number-부동 소수 값을 저장하는 타입
// 2진수, 8진수, 10진수, 16진수 사용 가능
let decimal: number = 6;
let hex: number = 0xf00d;
let binary: number = 0b1010;
let octal: number = 0o744

// null-값이 의도적으로 비어 있는 상태를 저장하는 타입
let n: null = null;

// undefined-아무 값이 할당되지 않은 상태를 저장하는 타입
let u: undefined = undefined;

// typeof로 데이터 타입을 확인
typeof null // 'object'
typeof undefined // 'undefined'
null === undefined // false
null == undefined // true
null === null // true
null == null // true
!null // true
isNaN(1 + null) // false
isNaN(1 + undefined) // true
  • 참조 자료형(reference type)
    -객체, 배열, 함수 등과 같은 object 형식의 타입
    -메모리에 값을 주소로 저장하고 출력 시 메모리 주소와 일치하는 값을 출력
// object-기본 자료형에 해당하지 않는 타입
// string, boolean, number, null, undefined를 제외한 타입
function create(o: object): void{}
create({ prop: 0 }) // 성공
create([1, 2, 3]) // 성공
create("string") // error
create(false) // error
create(42) // error
create(null) // error
create(undefined) // error

//array- 배열을 저장하는 타입
let arr: number[] = [1, 2, 3]
// 아래와 같이 제네릭을 사용한 타입 표기 가능
let arr: Array<number> = [1, 2, 3]
  • 추가 제공 자료형
    -TypeScript에서 개발자의 편의를 위해 추가로 제공하는 타입
// tuple-길이와 각 요소의 타입이 정해진 배열을 저장하는 타입
let arr: [string, number] = ["Hi", 6];
arr[1].concat("!");
// Error, 'number' does not have 'concat’
// 정의하지 않은 index 호출 시 오류
arr[3] = "hello";
// Error, Property '3' does not exist on type '[
string, number]'

// enum-특정 값(상수)들의 집합을 저장하는 타입
enum Car { BUS, TAXI, SUV };
let bus: Car = Car.BUS;
let bus: Car = Car[0]; // 인덱스 번호로 접근
// 인덱스를 사용자 편의로 변경
enum Car { BUS = 1, TAXI = 2, SUV = 3 };
let taxi: String = Car[2];
enum Car { BUS = 2, TAXI, SUV };
let taxi: String = Car[3];

// any-모든 타입을 저장 가능
// 컴파일 중 타입 검사를 하지 않음
let str: any = "hi";
let num: any = 10;
let arr: any = ["a", 2, true];

// void-보통 함수에서 반환 값이 없을 때, any의 반대 타입
// 변수에는 undefined와 null만 할당하고, 함수에는 반환 값을 설정할 수 없는 타입
let unknown: void = undefined;
function sayHi(): void {
console.log("hi");
}

0개의 댓글