Typescript에 대한 간단한 소개

Typescript의 몇 가지 개념에 대한 간략한 소개

타입스크립트 컴파일러

TypeScript 컴파일러는 TypeScript 코드를 일반 JavaScript 코드로 변환하는 JavaScript 프로그램입니다. TypeScript로 작성되었으며 JavaScript를 지원하는 모든 플랫폼에서 실행할 수 있습니다. TypeScript 컴파일러는 공개 소스이며 GitHub에서 사용할 수 있습니다. 컴파일러는 Microsoft에서 개발 및 유지 관리하며 명령줄에서 사용하거나 Visual Studio 및 WebStorm과 같은 널리 사용되는 IDE용 플러그인으로 사용할 수 있습니다.

TypeScript 컴파일러는 Node.js, Internet Explorer 및 Chrome과 같은 다양한 JavaScript 런타임과 호환되는 JavaScript 코드를 내보낼 수 있습니다. 생성된 JavaScript 코드를 다시 TypeScript 코드에 매핑하는 소스 맵을 생성할 수도 있습니다. 이를 통해 브라우저에서 TypeScript 코드를 디버깅할 수 있습니다.

컴파일러는 유형 오류를 확인하도록 구성할 수 있으며 오류가 발견되면 오류를 보고합니다. 원하는 경우 유형 검사를 비활성화할 수 있습니다. TypeScript 컴파일러는 Apache 2.0 오픈 소스 라이선스에 따라 사용할 수 있습니다.

강력한 형식의 언어가 아닙니다.

Typescript는 특정 유형으로 변수를 선언할 필요가 없기 때문에 강력한 유형의 언어가 아닙니다. 이는 변수가 한 유형으로 선언된 다음 다른 유형의 값에 재할당될 수 있음을 의미합니다. 변수가 선언된 형식과 호환되지 않는 방식으로 사용되면 오류가 발생할 수 있습니다.

이 특성을 설명하는 기본 예는 "any" 유형으로 표시할 수 있습니다.

// We initialze the variable as a string.
const something: any = "Tom";

// Now it's a number. This is valid TypeScript code.
something = 42;

TypeScript를 JavaScript로 컴파일

TypeScript 컴파일러는 TypeScript 코드를 가져와 일반 JavaScript 코드로 변환합니다. 이 프로세스를 트랜스필이라고 합니다. 컴파일러는 먼저 구문 오류를 확인하는 TypeScript 코드를 구문 분석합니다. 오류가 발견되지 않으면 컴파일러는 유형 오류를 확인합니다. 유형 오류가 발견되면 컴파일러는 이를 보고하고 종료합니다.

유형 오류가 발견되지 않으면 컴파일러는 계속해서 JavaScript 코드를 내보냅니다. 내보낸 JavaScript 코드는 지정된 대상 JavaScript 런타임과 호환됩니다.

TypeScript 컴파일러는 생성된 JavaScript 코드를 다시 TypeScript 코드에 매핑하는 소스 맵을 생성할 수도 있습니다. 이를 통해 브라우저에서 TypeScript 코드를 디버깅할 수 있습니다.

TypeScript 언어 서버

TypeScript 언어 서버는 TypeScript 프로젝트에 대한 코드 완성, 정의로 이동 및 유형 검사와 같은 기능을 제공하는 언어 서버입니다.

TypeScript 컴파일러가 이러한 기능을 제공하려면 언어 서버가 필요합니다. 언어 서버가 없으면 TypeScript 컴파일러는 구문 강조 표시 및 코드 형식 지정과 같은 기본 기능만 제공할 수 있습니다. TypeScript 언어 서버는 오픈 소스이며 GitHub에서 사용할 수 있습니다.

TypeScript 프로젝트를 만드는 단계

단계를 설명하기 전에 터미널에서 TypeScript 프로젝트를 초기화하는 명령이 있습니다.

npx tsc --init

설명: TypeScript 컴파일러를 설치합니다. 프로젝트의 루트에 tsconfig.json 파일을 생성합니다. 이 파일에는 TypeScript 컴파일러에 대한 컴파일러 옵션이 포함되어 있습니다. src 디렉토리를 tsconfig.json 파일에 추가하십시오. TypeScript 소스 파일이 위치할 위치입니다.

src 디렉토리에 main.ts 파일을 추가합니다. 이것은 TypeScript 프로그램의 진입점입니다. 명령줄에서 tsc를 실행하여 TypeScript 코드를 컴파일합니다. 그러면 src 디렉터리에 JavaScript 파일이 생성됩니다. 명령줄에서 node main.js를 실행하여 TypeScript 프로그램을 실행합니다.

TypeScript와 JavaScript의 차이점

TypeScript와 다른 강력한 형식의 언어 사이에는 몇 가지 주요 차이점이 있습니다. TypeScript는 JavaScript의 상위 집합입니다. 즉, 유효한 JavaScript 코드도 유효한 TypeScript 코드입니다. 이를 통해 기존 JavaScript 프로젝트에 쉽게 채택할 수 있습니다.

TypeScript는 선택적 유형 시스템을 사용하므로 변수에 유형을 지정할 수 있지만 필수는 아닙니다. Swift 및 Kotlin과 같은 다른 강력한 유형의 언어는 모든 변수를 특정 유형으로 선언해야 하는 필수 유형 시스템을 사용합니다.

TypeScript는 유형이 안전한 컬렉션 및 기타 데이터 구조를 허용하는 제네릭을 지원합니다. JavaScript에서는 사용할 수 없습니다.

코딩에 Typescript 대신 Javascript를 사용해야 하는 경우는 언제입니까?

JavaScript 또는 TypeScript를 언제 사용해야 하는지에 대한 엄격한 규칙은 없습니다. 작업에 적합한 도구를 선택하는 것은 개발자의 몫입니다. 그러나 따를 수 있는 몇 가지 일반적인 지침이 있습니다.

프로젝트가 이미 JavaScript로 작성된 경우 일반적으로 JavaScript를 계속 사용하는 것이 가장 좋습니다. TypeScript를 사용하기 위해 코드를 TypeScript로 변환할 필요는 없습니다. 그러나 숨겨진 버그로 이어지는 유형 시스템이 없기 때문에 JavaScript 프로젝트를 유지 관리하는 것이 더 어려울 수 있음을 명심하십시오. 따라서 향후 프로젝트를 유지 관리(및 확장)할 예정이라면 TypeScript 채택을 고려하는 것이 가장 좋습니다.

프로젝트가 처음부터 시작하는 경우 일반적으로 TypeScript를 사용하는 것이 가장 좋습니다. 이것은 장기적으로 더 나은 코드 구성 및 유지 관리를 허용합니다.

간단한 예

// TypeScript.
class Person {
  name: string;
  age: number;
}

const person: Person = new Person();
const person.name = "Tom";
const person.age = 42;

// JavaScript.
var Person = function() {};
Person.prototype.name = "";
Person.prototype.age = 0;

// TypeScript.
// Here's we're also using the class, but this
// time conforming to an interface, something that
// doesn't exist in JavaScript.
interface IPerson {
  name: string;
  age: number;
}

class Person implements IPerson {
  name: string;
  age: number;
}

// JavaScript.
var IPerson = function() {};
IPerson.prototype.name = "";
IPerson.prototype.age = 0;

var Person = function() {};
Person.prototype = Object.create(IPerson);

닫는 말

TypeScript는 코드 품질을 향상시키는 데 도움이 되는 강력한 언어입니다. 시작하기 쉽고 JavaScript를 지원하는 모든 플랫폼에서 사용할 수 있습니다. 이 기사는 언어가 지금 배울 훨씬 더 많은 기능과 개념을 제공하기 때문에 매우 간단한 소개만 제공했습니다.

유용한 학습 자료를 보려면 페이지 끝에 있는 부록의 링크를 확인하십시오.