본문 바로가기

개발/ETC

[TypeScript] 타입스크립트 기본 문법 1편

 

타입스크립트(TypeScript)???

- 마이크로소프트에서 개발한 자바스크립트 수퍼셋으로 대규모 어플리케이션 개발을 위해 개발된 언어

(수퍼셋: 상위확장)

- 여러 운영체제 및 브라우저에서 사용 가능한 오픈소스이며, 웹앱 개발을 위해 자바스크립트를 기반으로 개발된 언어로, 기존 스크립트 코드를 포함 할 수도 있으며 스크립트의 한계를 극복 할 목적으로 개발되었다고 함

- ES5 문법의 상위집합. (ES5 = ECMAScript5: 표준화된 스크립트 프로그래밍 언어)

- 순수 자바스크립트로 컴파일되는 자바스크립트의 슈퍼셋

 

이쯤 정리한다..........

 

 

문법!

타입스크립트는 확장된 자바스크립트(MS사에서 내건 타입스크립트 슬로건 "JavaScript that scales")인 만큼 정적 타입 언어임(static type language)

전에 정적/동적 타입 언어에 대해 글 적어놓은 게 있으니 까먹었으면 가서 다시 볼 것

 

var let const

var는 전통적인 javascript 변수 선언자이다.

TypeScript가 JavaScript의 상위 호환인만큼 let과 const 선언자를 쓸 수 있다.

Scope 규칙에서 var를 사용함으로써 블록 외부에서 변수에 접근하면서 생기는 버그들이 있다.

그런 버그들을 방지?하기 위해 let과 const가 있다.

let은 지역변수, const는 상수 로 보면 된다.

function-scoped와 block-scoped 공부 해보면 앎!!!!

 

본격적인 문법 시작

 

1. 타입 표기 하기 (Type Annotation)

    let       mil:  boolean = true;

선언자  변수명 :  타입     =   값 ;

 

2. 변수

Number

let mil_age: number = 225;

 

String

let mil_name: string = 'mil';

let mil_introduce: string = `Hi, I'm ${mil_name}, and ${mil_age} years-old!!`;

= 작은 따옴표이든 큰 따옴표이든 상관 없이 쓰면 됨

= Template Literal은 백틱(` ` )을 씀

 

Boolean

let mil: boolean = true;

 

Any

let i_dont_know: any = 225;

i_dont_know = 'which type?';

i_dont_know = false;

= 알지 못하는 변수 유형에 이 타입을 사용함.

   동적으로 결정되는 변수의 유형을 any로 지정해줌(컴파일 시 any 타입에 대하여 타입 검사를 하지 않음!! wow)

 

Array

let mil_array: string[] = ['꿈', '꾸', '는', '밀'];

let mil_array_generic: Array<number> = [0, 5, 2, 5];

=배열 표현 방법이 2가지임

 

Tuple

let frends: [number, string] = [30, 'LEEJIWON'];

let belongings: [string, string[]];

belongings.push('chemeez', ['lil', 'notebook', 'mouse', 'cellphone']);

= 파이썬 배울 때 열심히 했던 튜플 나와서 반갑누

 

Enum

enum Color { Black, White, Yellow, Red, SkyBlue };

let c: Color = Color.Black; // 0

let c_name: string = Color[Color.Black]; // Black

 

Void

function fn_mil(): void {

    console.log('그냥 console만 찍으려구욤ㅋ');

}

 

Null & Undefined

let mil_null: null = null;

let mil_undefined: undefined = undefined;

 

Never

function mil_error(message: string): never {

    throw new Error(message);

}

= Naver 아님

= 에러에 많이 쓰이는 것 같음, 더 공부해봐야 할 듯

 

 

 

기본 문법을 알아야 소스 해석이 가능하쥬~!!!

호이팅

반응형

'개발 > ETC' 카테고리의 다른 글

[jqGrid] 그리드 내 페이징 시 scrollTop  (0) 2021.03.30
그리드 찾기 2  (0) 2020.12.01
[Git] Git Bash 명령어 정리  (1) 2020.07.11
-메모(확실한 용어정리)  (0) 2020.03.05
[Node.js] Node.js 시작해보기  (0) 2020.02.20