TypeScript 마카로그

TypeScript

타입스크립트 모듈 시스템 타입스크립트의 모듈 시스템타입스크립트에서 가리키는 모듈이라는 개념은 ES6+의 Modules 개념과 유사하다.모듈은 전역 변수와 구분되는 자체 유효 범위를 가지며 export, import와 같은 키워드를 사용하지 않으면 다른 파일에서 접근할 수 없다.자바스크립트의 모듈 시스템Import와 Export

17 days ago

2 min read

타입스크립트 타입 호환 타입 호환타입 호환이란 타입스크립트 코드에서 특정 타입이 다른 타입에 잘 맞는지를 의미한다.interface Ironman { name: string; } class Avengers { name: string; } let i: Ironman; i = new Avengers(); // OK, because of structural typing타ᄋ

17 days ago

3 min read

타입스크립트 타입 가드 유니온 타입을 사용하게 되면 사용한 타입들의 공통된 속성에만 접근할 수 있다.따라서, 공통되지 않은 속성에 접근하고 싶을 때 '타입 단언'을 사용하면 된다.if ((tony as Developer).skill) { var skill = (tony as Developer).skill; console.log(skill); } else if ((t

17 days ago

2 min read

타입스크립트 타입 단언 타입 단언타입스크립트보다 개발자가 타입을 더 잘 알고있으니, 개발자가 정의한 타입으로 간주하도록 하는 것이 타입 단언이다.DOM API를 조작할 때 가장 많이 사용하게 된다.// 타입 단언(type assertion) var a; a = 20; a = 'a'; var b = a; // b: anya의 값을 중간에 바꿔도 현재의 타입스크립트 추론방식으로는 맨

17 days ago

2 min read

타입스크립트 타입 추론 타입 추론VSCode 상에서 코드를 작성했을 때 그 코드의 타입이 무엇인지 정의해나가는 방식이 타입 추론이다.타입스크립트가 어떻게 타입을 추론하는지에 대해 알아보자.특정 변수를 선언해서 값을 할당한다거나, 함수의 파라미터의 기본값을 지정한다거나, 함수의 반환값을 설정해줄 때 타입 추론이 기본적으로 일어난다.var a;입력한 var a;에 마우스오버하면 va

17 days ago

5 min read

타입스크립트 제네릭 제네릭타입을 마치 함수의 파라미터 개념인 것처럼 받게 되는 것이다.C#, Java 등의 언어에서 재사용성이 높은 컴포넌트를 만들 때 자주 활용되는 특징이자 문법이다. 특히, 한가지 타입보다 여러 가지 타입에서 동작하는 컴포넌트를 생성하는데 사용한다.제네릭의 기본 문법function logText<T>(text: T):T { console.log

17 days ago

6 min read

타입스크립트 클래스 클래스ES2015(ES6)에서 소개된 문법으로, 클래스가 하는 역할은 기본적으로 인스턴스를 만들어 주는 것.자바스크립트 프로토타입 소개자바스크립트가 프로토타입 기반 언어라는 개념을 인식해야 클래스 사용시 이점을 이해하기 쉽다.많은 객체들을 활용할 때 중복되는 코드들에 대해 줄일 수 있는 방법이 필요한데, 이 방법이 자바스크

17 days ago

5 min read

타입스크립트 Enum 타입 이넘(Enums) 이란?특정 값들의 집합을 의미하는 자료형이다.실제 서비스 개발 시 드롭다운이나 정해져 있는 목록의값들을 지정할 때 사용하기 좋다.숫자형 이넘별도의 값을 지정하지 않을 경우 숫자형 이넘으로 취급된다.Shoes의 값을 지정하지 않았기 때문에, Shoes.Nike값이 0이므로 myShoes의 값도 0으로 출력된 것이다.이넘의값이 추가 될 수록

17 days ago

2 min read

타입스크립트 Union과 Intersection 타입 유니온 (Union) TypeUnion type은 특정 변수/파라미터에 하나 이상의 타입을 사용할 수 있게 해준다.// Union Type: 하나 이상의 타입을 사용할 수 있도록 해준다. var ej: string | number | boolean; function logMessage(value: string | number) { console.log(

17 days ago

4 min read

타입스크립트 타입 별칭 타입 별칭이란?특정 타입이나 인터페이스를 참조할 수 있는 타입 변수를 의미한다.// string 타입을 사용할 때 const name: string = 'capt'; // 타입 별칭을 사용할 때 type MyName = string; const name: MyName = 'capt';복잡한 구조도 타입 별칭을 이용해 정의할 수 있다.type

17 days ago

2 min read

타입스크립트 타입 기본 타입booleannumberstringobjectarraytupleenumanyvoidnullundefinedneverPromise변수문자열let str: string = 'hello';숫자let num: number = 10;배열// 제네릭 : Array<타입> let arr: Array<number> = [1, 2, 3];

17 days ago

6 min read

타입스크립트 설치 타입스크립트 프로젝트 시작브라우저가 ts파일을 인식하도록 js파일로 변환해야 함$ node -v: node 버전이 설치되어있는지 확인.$ npm i typescript -g: node 기반으로 사용하는 javascript 라이브러리인 typescript를 설치.$ tsc 파일명.ts: 해당 ts파일을 js로 변환. 해당 ts파일과 같은 이름, 내용의 js파

17 days ago

1 min read

타입스크립트 기초 타입스크립트란?자바스크립트에 타입을 부여한 확장된 언어자바스크립트와 달리 브라우저에서 실행하기 위해 파일을 한 번 변환하는 과정이 필요타입스크립트의 장점에러의 사전 방지브라우저 화면에서 데이터를 확인하기 전, 코드화면 상에서 데이터를 확인하고 에러 처리 가능코드 가이드 및 자동 완성 (개발 생산성 향상)해당하는 속성에서 제공하는 모든 API를 사용할 때,

17 days ago

3 min read

전상욱

6 팔로워

4 팔로잉

소프트웨어 개발자 전상욱입니다.

태그

정의장점JSts@ts-check설치tsc설정webpackinit기본 타입변수인터페이스함수타입 별칭인터페이스유니온 타입인터섹션 타입&숫자형 이넘문자형 이넘Enum클래스ES6ES2015상속_proto_제네릭함수 중복 선언유니온 타입추론타입 단언as타입 가드if타입 호환클래스함수ImportExport

최근 댓글

아직 댓글이 없어요