타이프스크립트를 시작하는 방법.

안녕하세요

이 게시물을 읽고 계시다면 제 첫 번째 기술 집필 블로그 게시물을 찾아주셔서 특별히 감사의 말씀을 전하고 싶습니다.

중국 속담에 '천 리 길도 한 걸음부터'라는 말이 있습니다.

첫째, 제 이름은 Abel Emmanuel이고 소프트웨어 개발자이자 오픈 소스 기고자이자 옹호자입니다. 겸손한 나 자신의 생일을 축하하고 싶습니다.

2024년 12월 20일 오늘부터 Typescript와 기술 글쓰기를 배우기 시작했습니다. 저는 Typescript를 꽤 가끔 알고 있었지만 중요하고 유용하며 풍부한 기능과 이것이 더 나은 코드를 작성하는 데 어떻게 도움이 되는지 본 적이 없습니다.

이상적으로는 제가 Typescript를 알고 있던 시점에 더 일찍 배우기를 거부했습니다. 나는 Typescript가 필요한 직업을 얻기 전까지는 JavaScript와 동일한 구문과 모든 것을 갖기 때문에 Typescript를 배우는 것이 유용하지 않다고 결론지었습니다.

이렇게 해서 Typescript를 제대로 배우기 시작했는데, 그렇지 않으면 Typescript에 푹 빠져버렸습니다.

오늘은 Typescript의 기본과 그것이 얼마나 중요한지, 그리고 이것이 코드 작성 오류를 줄이는 데 어떻게 도움이 되는지 공유하고 싶습니다.

태생부터 JavaScript는 C, C, C#, Rust 및 기타 저수준 프로그래밍 언어와 같은 형식화된 언어가 아닙니다.

입력 언어에서는 변수와 값에 유형이 있습니다.

이것이 바로 C 프로그래밍 언어를 실제적인 예시로 사용한 Typed-Language의 의미입니다.

예를 들어 JavaScript에서 변수를 정의하려면:

let x = 5
typeof x    //number

JavaScript에서는 x를 문자열 값으로 재할당할 수 있습니다.

x = "Emmanuel"
typeof x    //string

변수가 값 데이터 유형을 인식하도록 해야 하는 C 프로그래밍 언어와 같은 저수준 언어와 비교해 보세요. 예를 들면 다음과 같습니다.

init x =  5
float y = 0.5

변수 x와 y를 재할당하려고 하면 오류가 발생합니다. 그러나 JavaScript는 느슨한 형식의 언어이므로 코드에 많은 버그를 일으킬 수 있습니다.

이를 방지하려면 Typescript라는 JavaScript의 상위 세트가 필요합니다. Typescript는 프로그램을 실행하기 전에 프로그램의 오류를 확인하는 데 도움이 되는 정적 유형 검사기입니다.

시작하세요
Typescript를 프로젝트에 전역적으로 또는 로컬로 설치하세요.
npm install -g typescript

폴더를 만들고 이름을 typescript로 지정하세요.

폴더(typescript)를 마우스 오른쪽 버튼으로 클릭하고 Visual Studio 코드로 열고 test.ts 파일을 만듭니다.

이 작업을 마친 후 다음 단계는 타이프스크립트 작성을 시작하는 것입니다.

test.ts 파일 내부에 코드를 복사하여 붙여넣고 실행하세요.

console.log("Hello world");

typescript 파일을 실행하려면. 명령줄 인터페이스(CLI)와 tsc test.ts를 엽니다. 이 명령은 TypeScript 파일을 실행합니다.

참고: typescript를 설치하지 않으면 CLI에서 tsc에 액세스할 수 없습니다.

실행한 후에는 CLI에서 아무 일도 일어나지 않지만 폴더에 test.js라는 새 파일이 있다는 것을 알 수 있습니다.

test.js 파일을 열면 실행한 명령이 test.ts의 모든 내용을 test.js로 출력한다는 것을 알 수 있습니다.

코드에 유형을 포함시키세요. Javascript에서 어떻게 보이는지 살펴보겠습니다.

let x = 5
typeof x    //number

tsc test.ts를 실행하세요. 특별한 일은 없었습니다.
그러나 함수 호출 Meet()이 Meet(7)과 같은 하나의 인수를 얻는다고 가정합니다.

Typescript에 오류가 표시됩니다.

x = "Emmanuel"
typeof x    //string

일반적으로 JavaScript 세계에서는 코드가 훌륭하지만 우리가 원하는 것은 아닙니다. 따라서 런타임에 오류가 발생하지 않더라도. Typescript는 문제를 사전에 식별하는 데 도움이 됩니다. 이것은 TypeScript의 멋진 부분입니다. 버그가 적은 코드를 작성하는 데 도움이 됩니다.

이 코드를 살펴보겠습니다.

init x =  5
float y = 0.5

참고 함수 Meet(이름: 문자열, ID: 숫자), 추가 :string 및 :number. 이것은 우리가 인수 문자열과 숫자를 기대하고 있음을 알려줍니다. 그렇지 않으면 코드에서 오류가 발생합니다.

유형을 반환하는 함수
함수가 특정 유형을 반환하도록 허용할 수 있습니다.

console.log("Hello world");

객체 유형

function meet(name, id){
    console.log(`Hello ${name}, your unique ID is ${id}.`)
}

meet("Abel Emmanuel", 7)
// Hello Abel Emmanuel, your unique ID is 7.

기타 기본 유형의 주석.

Expected 2 arguments, but got 1.ts(2554)
test.ts(1, 21): An argument for 'id' was not provided.

결론적으로 Typescript는 더 나은 JavaScript를 작성하고 버그를 줄이는 데 도움이 되는 입력 언어입니다. Typescript 공식 웹사이트: Typescript에서 자세한 내용을 읽어보세요.

이 게시물이 도움이 되었다고 생각하시면 알려주시고 개선할 수 있는 더 좋은 방법이 있으면 기꺼이 배우겠습니다. 첫 글을 읽어주셔서 감사합니다.

제가 멋진 콘텐츠를 공유하는 트위터에서 저를 팔로우하세요.

위 내용은 타이프스크립트를 시작하는 방법.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!