본문 바로가기
C++ 200제/코딩 IT 정보

TypeScript 강좌 7. 변수 선언 및 3가지 사용 방법

by vicddory 2020. 1. 12.

변수

TypeScript와 JavaScript의 가장 큰 차이점은 형태(자료형)입니다. 타입스크립트 자료형이 등장하는 경우는 크게 세 가지입니다.


  • 변수 (속성 포함)
  • 함수 인수
  • 함수 반환 값


이 글에서는 먼저 변수를 살펴보고 TypeScript의 타입 시스템 일부를 소개합니다.


함수는 함수의 장에서 설명합니다. 타입 시스템 세부 내용은 다른 장에서 각각 설명합니다.

세 가지 선언 구문

변수 선언에는 const, let이 있습니다. 항상 const 사용을 먼저 고려하세요.


타입스크립트 변수는 일단 const로 선언하고 재할당이 필요한 곳만 let으로 변경합니다. 변경될 필요가 없다면 "이제 변하지 않겠어"라고 선언함으로써 코드 복잡성을 줄이고 가독성을 높입니다.


또한, const는 많은 C/C++ 경험자를 괴롭힌 객체의 불변성에는 관여하지 않지만, const로 선언한 변수에 저장된 배열 요소를 수정(배열 요소 추가, 속성 변경 등)할 순 있습니다. 따라서 사용 범위는 꽤 넓습니다. (이게 뭔 말이야? C++ 개발자로선 배열 요소를 수정하는 게 이해가 안 됩니다 ...)


변수 사용 

// 일단 const 사용

const name = "작은동물";


// 변경이 필요하다면 let 사용

// 삼항연산자 사용할 때도 const 사용할 수 있음 (? 응? 전 일단 c++ 개발자입니다)

let name;


if (mode === "slack") {

    name = "소형견";

} else if (mode === "twitter") {

    name = "작은동물";

}


또한, JavaScript완 달리 정의되지 않은 타입스크립트 변수에 할당하면 오류입니다.


undefinedVar = 10;

// error TS2552: Cannot find name 'undefinedVar'.




주석

예전 JavaScript는 변수 선언에 사용할 때 var만 사용할 수 있었습니다. var는 범위가 함수 단위까지 확장해 영향 범위가 넓은데, 필요 이상으로 넓어지는 단점도 있습니다. 또한, 선언(정의) 전에 접근해도 오류가 발생하지 않는 등 안전성이 떨어집니다. 현재도 사용할 순 있지만, 적극적으로 사용하진 않고 있습니다.


변수 사용 

// 예전 코딩 방법

var name = "작은 동물";

변수 유형 정의

TypeScript엔 몇 가지 변수 유형이 있습니다.


TypeScript는 변수 이름 뒤에 접미사로 형태(자료형)를 씁니다. Go, Rust, Python3 등에서 볼 수 있습니다. 한 번 정의하면 다른 형식의 데이터 대입 시 컴파일러가 오류를 표시합니다. 이를 통해 타입스크립트 프로그램 오류를 쉽게 찾을 수 있습니다. 또한, 형태가 고정되면 Visual Studio Code 등의 편집기에서 코드 완성 기능을 완벽하게 사용할 수 있습니다.


변수 유형의 정의 

// name은 문자열

let name: string;


// 다른 형태의 데이터를 대입하면 에러 발생

// error TS2322: Type '123' is not assignable to type 'string'

name = 123;


또한, 대입할 경우엔 오른쪽 데이터 유형이 자동으로 설정됩니다. 이것은 타입 추론이라는 기능으로, 이 덕분에 메소드의 인수 또는 클래스나 구조체 필드 이외의 많은 장소에서 형태를 생략할 수 있습니다.


추론

// 대입할 때 대입 데이터에서 자료형을 유추할 수 있는 경우 자동 설정됨

// 오른쪽 문자열로 알 수 있음

let title = "작은 가족";


// 대입도 안 하고, 형 정의도 없다면 무엇이든 대입되는 any 형이 됩니다.

let address;


// 명시적으로 any를 설정할 수 있습니다

let address: any;




더 유연한 형식 정의

TypeScript는 Java, C++, Go 등의 언어를 사용한 경험이 있는 분들에게 약간 위화감을 느끼게 하는 독특한 유연함이 있습니다. 자료형이 프로그래밍 지원만 하는 것으로 이해하고, 정적 메모리 할당까지 고려하는 프로그래머에겐 다소 황당할 수 있습니다. 타입스크립트엔 2개 정도 독특한(?) 유연한 기능이 있습니다.


A도 B도 가능하다

값도 자료형 체계로 다룬다


A도 B도 가능하다는

예를 들어 숫자와 문자열을 모두 받을 수(다른 자료형 데이터는 거부) 있다는 겁니다. (개인적으로 충격이었음)




... 미완성 글 입니다 ...

댓글