TypeScript 소개

기본 사항

TypeScript는 JavaScript의 상위 집합입니다. 이 오픈 소스 언어는 JavaScript를 기반으로 하며 개발자에게 유리한 새로운 기능을 추가합니다. Microsoft에서 개발하여 2012년에 처음 공개되었습니다. TypeScript는 브라우저나 기타 JavaScript 환경에서 실행할 수 없습니다. 대신 TypeScript 코드를 일반 JavaScript로 먼저 컴파일해야 하는데, 일부에서는 이것이 단점이라고 말할 수 있습니다. 그러나 이 컴파일 단계에서는 오류 검사와 같은 몇 가지 이점이 추가됩니다.

컴파일

TypeScript는 기술적으로 JavaScript에 대해 transpiled입니다. 코드 변환은 동일한 추상화 수준에서 한 언어에서 다른 언어로 코드를 변경하는 것을 의미합니다. 컴파일 코드가 상위 언어에서 하위 수준 언어로 변경되는 경우. 예를 들어 언어 Go는 기계 코드로 컴파일됩니다. TypeScript를 JavaScript로 변환하면 개발자가 JS 해결 방법으로 컴파일되는 새로운 기능을 사용할 수 있습니다. 예를 들어 이 TypeScript 코드와 이에 상응하는 트랜스파일된 JS 코드를 살펴보세요.



이 스크린샷의 코드는 TypeScript 웹 사이트quick tutorial에서 가져온 것입니다. 컴파일된 JS 코드가 훨씬 더 길고 명확하지 않다는 것을 알 수 있습니다. TypeScript의 추가 기능은 코드에 오류가 있으면 컴파일 중에 개발자에게 오류가 표시된다는 것입니다. 예를 들어 함수가 매개변수 없이 호출되고 매개변수로 문자열이 필요한 경우 error TS2554: Expected 1 arguments, but got 0. 라는 오류가 발생합니다. TypeScript는 또한 정확한 코드 줄을 표시하고 오류가 발생한 줄 내의 지점을 표시합니다.

greeter.ts:7:27 - error TS2554: Expected 1 arguments, but got 0.

7 document.body.innerHTML = greeter();
                            ~~~~~~~~~

  greeter.ts:1:18
    1 function greeter(person: string) {
                       ~~~~~~~~~~~~~~
    An argument for 'person' was not provided.


Found 1 error.

타자

TypeScript를 통해 개발자는 정적 타이핑을 사용할 수 있습니다. 필수는 아니지만 개발자가 컴파일 시 오류를 포착할 수 있습니다. 예를 들어 문자열이 필요한 함수에 배열을 인수로 전달하려고 하면 다음 오류가 발생합니다. error TS2345: Argument of type 'number[]' is not assignable to parameter of type 'string'. 다음은 TypeScript에서 입력이 사용되는 방법의 예입니다.

let color: string = "blue";

사용할 수 있는 유형은 다음과 같습니다.

boolean

number

string

number[] (배열용입니다. number를 배열의 데이터 유형으로 바꿉니다. 배열은 다음과 같이 쓸 수도 있습니다. Array<number> = [1, 2, 3] )

튜플: 특정 유형의 요소 수가 고정된 배열을 선언할 수 있습니다. 예: let a: [string, number];

enum 상수 집합에 이름을 지정할 수 있습니다. 예: enum Direction { Up: "UP", Down: "DOWN" }

any (데이터 유형을 알 수 없는 경우 any로 레이블을 지정하면 컴파일하는 동안 값이 검사를 통과합니다.)

void (유형이 없음을 설명합니다. 이 유형에는 null 또는 undefined만 할당할 수 있습니다.)

undefined

null

never (항상 오류를 발생시키는 함수와 같이 발생하지 않는 값에 사용됨)

object (기본 데이터 유형이 아닌 모든 항목을 나타냄)

유형은 TypeScript에서 선택 사항이며 컴파일 중에 유추할 수 있습니다.

TypeScript 설치

TypeScript를 설치하고 직접 사용해 보려면 다음 명령을 사용하십시오. npm: npm install -g typescript .

TypeScript 코드를 .ts 파일에 작성할 때 명령줄에서 tsc {your-file-name_here}.ts를 실행하여 JavaScript로 컴파일하십시오. 컴파일이 완료되면 컴파일된 JavaScript 코드가 있는 디렉터리에 새 .js 파일이 표시됩니다.

이전에 TypeScript를 사용해 본 적이 있고 그것에 대해 어떻게 생각하는지 알려주세요. 읽어 주셔서 감사합니다. 모두 안전하게 지내고 계시길 바랍니다!




참조

TypeScript Documentation

Wikipedia

Transpile vs Compile