TypeScript 의 설치,사용,자동 컴 파일 을 이해 하 는 튜 토리 얼

1.첫 번 째 타 입 스 크 립 트
지난 글 에서 소개 해 드 렸 어 요TypeScript 의 설치,사용,자동 컴 파일 실현  필요 한 친구 클릭 하여 보기.

TypeScript 소개
      TypeScript 는 마이크로소프트 가 개발 한 오픈 소스,크로스 플랫폼 의 프로 그래 밍 언어 이다.이것 은 자바 스 크 립 트 의 초 집합 으로 최종 적 으로 자바 스 크 립 트 코드 로 컴 파일 될 것 입 니 다.
      2012 년 10 월 에 마이크로소프트 는 첫 번 째 공개 버 전의 TypeScript 를 발 표 했 고 2013 년 6 월 19 일 에 미리 보기 버 전 을 거 친 후에 마이크로소프트 는 정식 판 TypeScript 를 발표 했다.
      TypeScript 의 저 자 는 앤 더 스 헤 일 스 버그,C\#의 수석 구조 사다.그것 은 오픈 소스 와 크로스 플랫폼 의 프로 그래 밍 언어 이다.
      TypeScript 는 JavaScript 의 문법 을 확장 하기 때문에 기 존의 JavaScript 프로그램 은 TypeScript 환경 에서 실 행 될 수 있 습 니 다.
      TypeScript 는 대형 응용 개발 을 위해 설계 되 었 으 며 자바 script 으로 컴 파일 할 수 있 습 니 다.
      TypeScript 는 JavaScript 의 초 집합 으로 주로 유형 시스템 과 ES6+에 대한 지원**을 제공 합 니 다.Microsoft 에서 개발 하고 코드 는 GitHub 에서 시 작 됩 니 다.
      TypeScript 는 JavaScript 의 초 집합 으로 주로 형식 시스템 과 ES6+에 대한 지원 을 제공 합 니 다.Microsoft 에서 개발 하고 코드 는 GitHub(opens new window)에서 시 작 됩 니 다.
TypeScript 의 특징
TypeScript 는 주로 3 가지 특징 이 있 습 니 다.
JavaScript 에서 시작 하여 JavaScript 로 돌아 갑 니 다.
      TypeScript 는 순수 하고 간결 한 JavaScript 코드 를 컴 파일 할 수 있 으 며,모든 브 라 우 저,Node.js 환경 과 ECMAScript 3(또는 더 높 은 버 전)를 지원 하 는 JavaScript 엔진 에서 실행 할 수 있 습 니 다.
강력 한 유형 시스템
      형식 시스템 은 자 바스 크 립 트 개발 자가 자 바스 크 립 트 응용 프로그램 을 개발 할 때 효율 적 인 개발 도구 와 상용 조작,예 를 들 어 정적 검사 와 코드 재 구성 을 사용 할 수 있 도록 한다.
선진 적 인 자 바스 크 립 트
      TypeScript 는 2015 년 ECMAScript 와 미래의 제안 에서 나 온 특성,예 를 들 어 비동기 기능 과 Decorators 등 최신 및 끊임없이 발전 하 는 JavaScript 특성 을 제공 하여 건장 한 구성 요 소 를 만 드 는 데 도움 을 줍 니 다.
총결산
      TypeScript 는 지역 사회 에서 유행 도가 점점 높 아 지고 대형 프로젝트 에 도 적합 하 며 기초 라 이브 러 리 에 도 적합 하여 개발 효율 과 체험 을 향상 시 키 는 데 큰 도움 을 주 었 습 니 다.
2.TypeScript 설치
명령 행 은 다음 명령 을 실행 합 니 다.전역 에 TypeScript 를 설치 합 니 다.

npm install -g typescript

설치 가 완료 되면 콘 솔 에서 다음 명령 을 실행 하고 설치 가 성 공 했 는 지 확인 합 니 다(3.x):

tsc -V

3.첫 번 째 TypeScript 프로그램
TS 프로그램 작성
   src/helloworld.ts

//str     string   
 function aa(str:string){
        return "   " + str
    }
    let text='   '
    console.log(aa(text))

   src/index.html

//     ts   ，        （  ts        js   ，           ）
  <script src="./helloworld.ts"></script>

수 동 컴 파일 코드
   우 리 는.ts 확장 자 를 사 용 했 지만,이 코드 는 단지 자 바스 크 립 트 일 뿐이다.
   터미널 에서 TypeScript 컴 파일 러 를 실행 합 니 다:

tsc helloworld.ts

출력 결 과 는 입력 파일 과 같은 JavsScript 코드 를 포함 하 는 helloworld.js 파일 입 니 다.
터미널 에서 Node.js 를 통 해 이 코드 를 실행 합 니 다.

node helloworld.js

src/index.html 수정

<script src="./helloworld.js"></script>

콘 솔 출력:
Hello, Yee
hello World.js 의 코드 를 다시 보 겠 습 니 다.

 function aa(str) {
        return "   " + str;
    }
    var text = '   ';
    console.log(aa(text));

총결산

 ts 파일 에 js 문법 코드 를 직접 쓰 면 html 파일 에 ts 파일 을 직접 도입 하고 구 글 브 라 우 저 에서 직접 사용 할 수 있 습 니 다

만약 에 ts 파일 에 ts 의 문법 코드 가 있다 면 이 ts 파일 을 js 파일 로 컴 파일 하고 html 파일 에서 js 의 파일 을 인용 하여 사용 해 야 합 니 다

ts 파일 의 함수 중의 형 삼 은 특정한 유형 을 사용 하여 수식 하면 최종 적 으로 컴 파일 된 js 파일 에 이런 유형 이 없습니다

ts 파일 의 변 수 는 let 를 사용 하여 수식 하고 컴 파일 된 js 파일 에서 수식 하면 var 가 됩 니 다

vscode 자동 컴 파일
1).설정 파일 생 성 tsconfig.json
단계:
   새 폴 더,터미널 을 열 고 명령 을 입력 하면 tsconfig.json 설정 이 자동 으로 생 성 됩 니 다.

tsc --init

2).이 파일 을 열 어 tsconfig.json 설정 을 수정 합 니 다.

 "outDir": "./js",
    "strict": false,

3).감시 작업 시작:
터미널->작업 실행->모든 작업 표시->tsconfig.json 감시
저장 을 다시 수정 하면 해당 하 는 js 파일 이 자동 으로 생 성 됩 니 다.
이상 은 TypeScript 의 설치,사용,자동 으로 컴 파일 된 튜 토리 얼 에 대한 상세 한 내용 입 니 다.TypeScript 설치 에 대해 자동 으로 컴 파일 된 자 료 를 더 많이 알 고 있 습 니 다.다른 관련 글 을 주목 하 십시오!