본문 바로가기
TypeScript 강좌 14. 복합형 : 배열 튜플 스프레드 사용법 복합형다른 원시형 또는 복합형을 내부에 포함하여 큰 데이터로 정의하는 데이터 자료형을 타입스크립트 「복합형」이라고 합니다. 배열, 객체 등이 이에 해당합니다. 클래스를 정의하고 만드는 인스턴스도 복합형이며, 리터럴로 정의하는 배열 및 오브젝트들을 소개합니다. 배열배열은 TypeScript에서 많이 사용되는 리터럴입니다. 스프레드 구문, 분할, 할당 등이 더해져, 다양한 방법을 구사하여 함수형 언어처럼 쓰이기도 합니다. 배열은 다음에 소개하는 개체뿐만 아니라 리터럴로 정의할 수 있는 타입스크립트 복합형 중 하나입니다. // 변수에 대입. 자료형을 부여하고 [ ] = 여기에 요소를 삽입합니다// 자료형이 똑같으면, 자료형 생략 가능합니다const years: number[] = [2019, 2020, 202.. 2020. 2. 15.
TypeScript 강좌 13. undefined, null 프리미티브 속성 undefined와 nullJavaScript / TypeScript에 undefined와 null이 있습니다. 다른 언어에는 null(또는 None, nil 이라고도 부름)만 있는 경우가 대부분이지만, JavaScript / TypeScript에는 2종류로 등장합니다. 이 가운데 타입스크립트 undefined는 정의되지 않거나 아직 값이 할당되지 않은 변수를 참조할 때, 객체의 정의되지 않은 속성에 접근하면 리턴되는 값입니다. TypeScript는 클래스 등의 형식 정의 기능이 있어 코딩이 쉽다고 알려져 있는데, "undefined 발생으로 코드를 사전에 체크해 준다"는 것이 그 이 키워드의 본질이라는 생각이 듭니다. let favoriteGame: string; // 아직 대입하지 않아서 undefi.. 2020. 2. 7.
TypeScript 강좌 12. string Literal Primitive (문자열) TypeScript string literal (스트링 리터럴)타입스크립트 string 리터럴은 문자열을 표현합니다. 작은따옴표, 큰따옴표로 묶어 표현할 수 있습니다. 작은따옴표와 큰따옴표 중간에 줄 바꿈이 들어가면 "끝이 없다"고 오류가 납니다만, 역 따옴표로 여러 줄을 묶을 수 있어서 여러 줄 텍스트를 표현할 수 있습니다. JavaScript는 UTF-16이라는 문자 코드를 채용하고 있습니다. Java와 같습니다. 이모티콘(그림 문자) 등 일부 문자열은 하나의 문자로 데이터를 취급하지 못하여 두 문자로 표현할 수 있습니다. 이를 게이트 짝(게이트 쌍)이라고 합니다. // 값을 표시 // 싱글 쿼트, 더블 쿼트, 백 쿼트로 묶기 console.log('hello world'); // 변수에 대입. 변수.. 2020. 2. 6.
Typescript 함수형 변수(declare function type) 사용법 4개 타입스크립트에는 많은 타입이 있습니다. 자바스크립트 콜백 함수 좋아하는 분들에게도 이 글은 도움이 되리라 생각합니다. Solution 1 - any가장 안 좋은 방법입니다. 변수를 any 유형으로 선언하면 나중에 다른 함수를 할당할 수도 있습니다. let a:any; a = function ():void{ console.log("It works"); } Solution 2 - Function종종 인터페이스를 디자인할 때 실제 정의 형태를 모를 수 있는데, 키워드 Function을 사용하여 유형(정의 형태)의 형태를 쉽게 확인할 수 있습니다. let a:Function; a = function ():void{ console.log("It works"); } any 보단 괜찮죠? 변수 a에 function .. 2020. 1. 29.
TypeScript 강좌 11. Primitive 연산자 Math 객체 연산자+, -, *, /, %(나머지) 일반적인 수학(수치 계산) 연산자를 사용할 수 있습니다. 타입스크립트에선 이 밖에도 **라는 거듭제곱 연산자가 ES2016에 추가되었습니다. (예전에는 Math.pow(x, y) 사용) 또한, number 정수로 다루므로 typescript 역시, 비트 연산이 가능합니다. 비트 연산은 2진수로 표현된 표를 사용하여 계산한다고 생각하시면 됩니다. 컴퓨터의 내부는 비트 단위로 처리하므로 고속 로직 구현에 사용되는 경우가 많습니다. 비트 연산 용도로는 유전자 정보를 고속으로 계산하는데 사용하는 FM-Index와 같은 알고리즘 등이 있습니다. 타입스크립트 역시 간결한 데이터 구조가 핵심입니다. 그러나 비트 연산 시 정확도는 32비트 정수로 반올림하여 이루어집니다. 이 점은.. 2020. 1. 27.
TypeScript 강좌 10. Primitive 수치형 number 정수 숫자TypeScript에는 2종류의 내장된 숫자형이 있습니다. 대부분의 경우 타입스크립트 number를 사용합니다. numberTypeScript(또는 그 아래에서 실행되는 JavaScript)는 64비트 부동 소수점을 취급합니다. 이는 어떤 CPU에서도 기본적으로 같은 정밀도(IEEE 754 규격)를 가집니다. 정수를 손실 없이 저장할 수 있는 것은 53비트(-1)까지므로, ±약 9007조까지의 정수를 다룰 수 있습니다. 그 이상의 숫자를 넣으면 뒷자리가 오차로 잘리는 등 타입스크립트에서 문제가 발생합니다. 타입스크립트에서 정확한 상한과 하한은 Number.MAX_SAFE_INTEGER, Number.MIN_SAFE_INTEGER라는 상수로 확인할 수 있습니다. 또한 Number.isSafeIntege.. 2020. 1. 25.
TypeScript 강좌 9. Primitive(프리미티브) boolean Primitive 타입프로그램을 설명할 때 흔히 리터럴이라는 말이 나옵니다. 리터럴이란 것은 소스 코드의 고정된 값을 대표하는 용어(데이터 자료형)입니다. TypeScript에는 여러 종류가 있습니다. booleannumberstring배열객체함수undefinednull 이 가운데 더는 분해할 수 없는 단순한 데이터를 타입스크립트에선 "기본 형식, 원시형(Promitive 프리미티브)"이라고 합니다. boolean 리터럴타입스크립트 boolean 형은 true/false 두 논리 값을 표현하는 데이터 자료형입니다. if문, while 루프 등의 제어 구문과 삼항 연산자 등을 사용하여 Typescript 프로그램 동작을 제어하는 중요한 자료형입니다. // 값을 표시console.log(true);conso.. 2020. 1. 18.
TypeScript 강좌 6. 프로젝트 환경과 명령어 실행 프로젝트 폴더 공유 후 환경 구축 팀 내부에선 git 등으로 TypeScript 프로젝트 소스 코드를 공유합니다. JavaScript 계열 프로젝트는 그 안에 package.json, package-lock.json이 있습니다. 타입스크립트 프로젝트 배포 시 환경 구축을 하는 등 공유한 사람은 개발 환경을 손쉽게 재현할 수 있습니다. npm install dependencies와 devDependencies를 설치 npm install --prod dependencies만 설치 npm ci dependencies와 devDependencies를 설치 package-lock.json은 갱신하지 않음 npm ci --prod dependencies만 설치 package-lock.json은 갱신하지 않음 설치.. 2020. 1. 8.
TypeScript 강좌 5. Node.js 환경 체험하기 Node.js 생태계를 체험하자 TypeScript는 JavaScript로의 변환을 목적으로 만들어진 언어입니다. 공식적인 처리 루틴이 있고, 변환하면 JavaScript가 생성됩니다. 공부 목적으로 실행하려면 현재 몇 가지 옵션이 있습니다. 이 가운데 우선 안정적으로 사용할 수 있고, 비교적 간단한 것은 ts-node 입니다. 타입스크립트 웹 사이트 playground 1 : 공식 컴파일러로 변환하여 브라우저에서 실행tsc + Node.js : 공식 컴파일러로 변환하고 Node.js에서 실행babel + ts-loader + Node.js : Babel 통해 공식 컴파일러로 변환하고 Node.js에서 실행babel + @ babel / preset-typescript + Node.js : Babel에서.. 2019. 12. 17.
TypeScript null, undefined 확인 방법 (타입스크립트) null과 undefined는 다릅니다. 가령, json 항목 중 없는 항목에 접근할 때 undefined가 보이지 null이 보이진 않습니다.타입스크립트에서 null과 undefined를 한꺼번에 확인하는 방법은 없지만, 아래 typescript 소스를 통해 간단히 null과 undefined를 확인할 수 있습니다. var a: number;var b: number = null; function check(x, name) { if (x == null) { console.log(name + ' == null'); } if (x === null) { console.log(name + ' === null'); } if (typeof x === 'undefined') { console.log(name + ' .. 2019. 12. 12.
TypeScript 문자열 숫자 변경 - 단항연산자 (string to int) 'Timeout' 형식은 'number' 형식에 할당할 수 없습니다.ts(2322) number 숫자로 변경할 때 여러 에러 메시지가 발생하는데요. 간단히 + 단한연산자를 사용하거나 Number('문자열') 처럼 Number 함수를 사용하면 해결됩니다. private testNumber: number | undefined;var testVar = '100'; testNumber = +testVar; 위와 같이 typescript에서는 + 단항연산자를 사용할 수 있습니다. 자바스크립트에서 parseInt 또는 parseFloat 함수를 사용할 수 있는데, parseInt (null)은 NaN을 반환하지만 +null은 0을 반환하므로 위와 같이 + 단항연산자를 사용하는 것이 편리할 수도 있습니다. var x.. 2019. 11. 21.
TypeScript 7031 바인딩 요소 '인자' 암시적으로 any 형식이 있습니다 아래처럼 typescript를 선언할 때 발생하는 에러입니다. 함수 ({obj1, obj2} : {obj1 : 임의, obj2 : 임의}) {...} 해결하기 위한 여러가지 방법이 있는데, 몇 가지 소개하겠습니다. 먼저, 타입스크립트 interface, type 사용하여 actions 액션 인자를 정의하는 방법입니다. interface Options { test_var: string; payload?: BigInt;} type myType = { test_var: string; payload: BigInt;}; const actions = { TEST({ test_var, payload }: { test_var: string; payload?: BigInteger }) {}, TEST2({ test_va.. 2019. 11. 19.