TypeScript Starter 따라하기

 

 

 

TypeScript 란?

 

 

- Microsoft 에서 개발 및 유지관리하는 오픈소스프로그래밍 언어이다.

- JavaScript 의 모든 구문와 의미를 지원하면서 풍부한 구문과 추가 기능을 제공해준다.

- 즉 JavaScript를 확장한 언어로 JS 언어의 특성을 침범하지않고 최신 ECMA 표준을 지원한다.

- TypeScript 는 컴파일언어로 코드수준에서 미리 타입을 체크하여 오류를 잡아 낼 수 있다.

- Javascript의 단점이자 문제점인 형변환, 호이스팅, 복잡성 문제를 해결할 수 있는 코드이다.

 

greeting.ts

 

class Student {

fullName: string;

constructor(

public firstName: string,

public middleInitial: string,

public lastName: string

)

{

this.fullName = firstName + " " + middleInitial + " " + lastName;

}

}

interface Person {

firstName: string;

lastName: string;

}

function greeter(person: Person) {

return "Hello, " + person.firstName + " " + person.lastName;

}

let user = new Student("Code", ".k", "Reading");

document.body.innerHTML = greeter(user);

커멘드명령어 : tsc greeter.ts

 

greeter.js

 

var Student = /** @class */ (function () {

function Student(firstName, middleInitial, lastName) {

this.firstName = firstName;

this.middleInitial = middleInitial;

this.lastName = lastName;

this.fullName = firstName + " " + middleInitial + " " + lastName;

}

return Student;

}());

 

function greeter(person) {

return "Hello, " + person.firstName + " " + person.lastName;

}

 

var user = new Student("Code", ".k", "Reading");

 

document.body.innerHTML = greeter(user);

 

 

위의 예제는 TypeScript 의 공식 홈페이지에있는 5분 튜토리얼로 만든 예제 코드이다.

 

 

음 사실 아직 여기까지만해봐서는 TypeScript의 장점에 대해서는 알기 어려운것같다.

 

create-react-app 과 함께 설치하여 진행하는 예제를 확인해보려고한다.

 

 

code-reading 블로그에 방문해 주셔서 환영합니다.
댓글은 모두 환영하니 많이 달아주세요.