[TypeScript] TypeScript란

걸음걸음·2023년 2월 22일
0

TypeScript

목록 보기
1/8
post-thumbnail

Typescript ?

자바스크립트를 기반으로 하는 프로그램 언어
타입을 이용해 작동 방식에 대해 더 명시적으로 작성, 예상치 못한 에러 방지
타입을 사용하면 오류를 미리 감지하고, 일부 런타임 오류를 방지 가능

  • 타입스크립트의 타입은 컴파일 중 확인되는 반면, 자바스크립트의 타입은 런타임 중에 확인됨

타입 스크립트의 주요 원시 타입은 모두 소문자

tsc app.ts
// 터미널 입력 : app.ts를 컴파일 하는 즉시 html에서 가져와야 할 app.js 파일을 생성
function add(n1:number, n2:number){
  return n1 + n2;
}

add(1, 2) // 3
add(1, 2) // 타입 오류

객체

const person:{
  name:string;
  age:number;
} = {
  name:’abc’,
  age:123,
}

배열

let Arr:string[];
// Arr이 문자열로 이루어진 배열임을 표시
Arr = 'abc' // 배열이 아니기 때문에 오류 발생

튜플타입(Tuple)

길이와 타입이 고정된 배열.
배열에 필요한 값의 길이와 해당 값의 타입을 미리 알고 있는 경우 사용

const person:{
  name:string;
  age:number;
  state:[number, string] // 배열의 길이와 타입이 고정된 튜플 타입 설정
} = {
  name:’abc’,
  age:123,
  state:[2,'study']
}

열거형 타입(enum)

열거 목록 제공.

enum Role { ADMIN, READ_ONLY = 100, AUTHOR = 'AUTHOR' }
// 생성한 사용자 정의 enum을 참조할 수 있음
const person:{
  name:string;
  age:number;
  state:[number, string]
} = {
  name:’abc’,
  age:123,
  state:[2,'study'],
  role: Role.ADMIN
}
if(person.role === Role.AUTHOR){
  console.log('true');
}

any 타입

어떠한 값이든 받을 수 있는 지정
타입 오류가 발생하지 않지만 typescript를 사용하는 의미가 없기 때문에 잘 사용되지 않음

조합 타입(Union)

서로 다른 두 종류의 값을 사용해야 하는 경우 사용

function combine(input1:number|string, input2:number|string){
  if(typeof input1 === 'number' && typeof input2 === 'number'){
    return input1 + input2;
  } else {
    return input1.toString() + input2.toString();
}
console.log(combine(1,'def'))

리터럴 타입 ? ???

할당된 값이 정확하게 지정된 경우

const number = 5;
// 바뀌지 않는 값으로 명확하게 지정되어있으므로 number등의 타입추론이 일어나지 않음

타입 알리어스

타입을 직접 생성 가능

type Combinable = number | string;
type ConversionDescriptor = 'as-number' | 'as-text';
function combine(
	input1:Combinable,
    input2:Combinable,
    resultConversion:ConversionDescriptor
){
  if(typeof input1 === 'number' && typeof input2 === 'number'){
    return input1 + input2;
  } else {
    return input1.toString() + input2.toString();
}
profile
꾸준히 나아가는 개발자입니다.

0개의 댓글