Typescript

!(느낌표) 는 요소가 꼭 있다는 것을 알려줄 때 사용한다.튜플 exenum (열거형) ex값을 반환하지 않는 함수는 void를 표준으로 사용한다.값을 반환하지만 반환값이 없을 때 undefinded를 사용한다.콜백 함수는 자신이 전달되는 인수가 반환 값을 기대하지 않

target 으로 컴파일 후 js문법 버전을 설정할 수 있다.documet 나 console 를 사용할 수 있는 이유lib 설정을 안하면 기본 설정을 해주기 때문이다.ts가 js 파일을 컴파일할 수 있도록 해준다.ts가 컴파일을 수행하지 않더라도 구문을 검사하고 에러를

하나의 클래스가 하나의 인스턴스를 만드는 전략 = 싱글톤위의 콘솔은 작은 인스턴스임을 확인할 수 있다.

위를 축약할 수 있다.private는 해당 클래스에서만 접근 가능protected 상속한 클래스까지 접근 가능public는 모두 접근 가능

추상 클래스는 인스턴스화할 수 없고상속해서 사용해야합니다.상속할 때는 추상 메서드를 꼭 재정의해야합니다.추상 메서드가 있으면 꼭 추상 클래스여야 합니다.

인터페이스는 순수 타입스크립트 기능이다.인터페이스는 클래스와 다르게 청사진으로 사용하지 않는다.클래스는 인스턴스화할 수 있고 컴파일 되지만인터페이스는 인스턴스화할 수 없고 컴파일되지 않는다.

Combinable와 Numeric 의 공통 타입은 number 이므로 Universal 타입은 결국 number 가 된다.

typeof 객체 === '타입'메소드 이름 or 프로퍼티 이름 in 객체클래스 instanceof 메소드 이름 or 프로퍼티 이름typeof, in, instanceof 타입 가드를 사용할 수 있다.

타입을 직접 지정을 해서 오타를 방지하고 쉽게 사용할 수 있다.

null를 반환하지 않을 것이라는 확신이 있으면 !(느낌표)를 사용한다.그렇지 않으면 if문으로 확인한다.하지만 요소가 있다는 확신이 없기 때문에 형 변환을 할 수 없다.요소가 있을 때 형 변환을 하고 사용한다.

keyof 예) 제네릭 클래스

데코레이터 중 아래가 먼저 실행된다.WithTemplate 가 먼저, Logger 가 그 다음 실행된다.

Title, Description, People 위 3개의 인풋을 받는 form 태그를 렌더링하고 서브밋을 할 수 있는 앱을 ts 객체지향으로 만들어보자. 이렇게 돔을 렌더링 할 수 있다. 이제 서브밋 이벤트를 달아보자.

프로젝트 활성 상태에 따라

프로젝트를 만들 때목록에 추가하고리스너 함수를 추가할 수 있는상태 관리를 해보자.생성자를 private 으로 숨기고 getInstance 스태틱 메서드를 통해서 생성할 수 있도록 한다.하나의 인스턴스만 사용한다.이러한 방식이 싱글톤 방식이다.프로젝트를 생성할 때 프로젝

추상 private 는 ts가 지원하지 않는다.public 메서드는 private 메서드 위에 작성하는 것이 좋다.제네릭과 상속으로 코드 리팩토링을 해보자.

Component 클래스를 상속해서 목록을 렌더링 해보자.

프로젝트 인원이 1명일 때와 아닐 때다르게 렌더링하기 위해서 게터를 사용해보자.

프로젝트 목록을 드래그 앤 드롭을 적용해보자.먼저 HTML에 원하는 태그에 draggable="true" 속성을 추가하자.위 인터페이스를 사용할 것이다.이것을 implements 해보자.아이템에 dragstart, dragend를 적용했다.드롭될 목록에 dragover

tsconfigoutFile 은 ts가 namespace 와 연결되도록 한다.module AMD로 수정한다.클래스 이넘 인터페이스를 네임스페이스로 감싸고 export한다.import는 아래와 같이 한다.하지만 es6 모듈 사용법을 권장한다.

파일이 처음으로 임포트 되었을 때 1회 실행되고다른 파일에서 같은 파일을 임포트할 때는 다시 실행되지 않는다.

declare로 ts에게 알릴 수 있다.타입스크립트 지원이 안되면누군가 만들어놓은 type 관련 라이브러리를 설치해서 사용하면 된다.

노드는 ts 파일을 실행시킬 수 없다.tsc 명령어로 js 파일을 만들고 노드로 실행할 수 있다.이를 합친 ts-node 라는 것도 있다.프로젝트를 생성하고, ts 설정을 하자.npm init tsc --init컴파일을 관찰모드로 하고 노드몬으로 js 파일이 바뀔 때마