Typescript 기초문법

안녕하세요.

오늘은 Typescript의 기초 문법들을 알아보도록 하겠습니다.

ES6(ECMAScript6)란?

• ECMAScript는 자바스크립트 표준 단체인 ECMA가 제정하는 자바스크립트 표준이다.

  ECMAScript는 브라우저에 사용되는 자바스크립트 부분만 표준으로 정의한다.

  
  

Typescript란?

• Javascript superset 이며, 간단히 타입이 있는 자바스크립트라고 말할 수 있습니다.

Typescript 설치
(npm(node package module)이 설치되어 있다는 가정하에 설명합니다. Nodejs 설치시 함께 설치됩니다.)

• $ npm install -g typescript
• 설치한 typescript 버전 확인
  $ tsc -v

ts파일을 js파일로 컴파일

• tsc 파일명.ts
  $ tsc main.ts

변수

typescript에는 number, string, boolean, any 네 가지 타입이 있습니다.

• var isSuccess: boolean = true;
• var firstName: string = 'KIM';
• var height: number = 185;
• var initValue: any = 10; (any타입의 변수에는 어느 타입이던 들어올 수 있습니다.)

컬렉션

• var list: number[] = [1,2,3];
• var list:Array<number> = [1,2,3];

함수

• function addFunction(a: number, b: number) {
       return a+b;
  }
• var f1 = function(i: number): number { return i*i }
• var f2 = function(i: number) { return i*i }
• var f3 = (i: number): number => { return i*i }
• var f4 = (i: number) => { return i*i }

오브젝트

• var personObj = {
      firstName: 'lee',
      lastName: 'duyoung'
  }
• personObj["salary"] = 20000;
• for (var member in personObj) {

      if (personObj.hasOwnProperty(member)) {

          console.log("member: " + member + ", value: " + personObj[member]);

      }

  }

인터페이스

• 오브젝트에서 인터페이스 사용할 때
  
  
  interface Person {
      name: string;
      age: number;
      height?: number; //optional
      move(): void;
  }
  
  
  var dylee: Person = {
      name: "leeduyoung",
      age: 28,
      move:() => { }
  }

• 함수에서 인터페이스 사용할 때
  
  
  interface SearchFunc {
      (src: string, substring: string): boolean;
  }
  
  
  var mySearchFunction: SearchFunc = (src:string, sub:string) => {
      return src.search(sub) != -1;
  }

클래스

• class Point {
  
  

  x: number;

  constructor(x: number, public y: number = 0) {
      this.x = x;
  

  }

  dist() {

  return Math.sqrt(this.x * this.x + this.y * this*y);

  }

  
  

  static origin = new Point(0, 0);

  }

  var point1 = new Point(10, 20);

모두 즐거운 코딩하세요~