목록JavaScript/Typescript (5)
끄적이는 개발노트

이번 포스트에서는 이전에 배운 타입스크립트 개념으로 블록체인을 만드는 실습을 해본다. 다만, 지금은 블록체인이 무엇인지 구성요소에 대해서 알지 못하는 상태이다. 따라서, 강의를 학습하며, 타입스크립트가 프로젝트에 어떻게 사용되는지에 대해 초점을 맞춘다. 이번에 만들 간단한 블록체인 프로젝트 역시 노마드코더의 강의영상을 참고하여 학습하며 만들었다. 노마드코더의 'Typescript로 블록체인 만들기' 강의영상 1. watch 모드 설정 tsc-watch npm을 개발모드로 설치한다. $> npm i tsc-watch --dev tsconfig.json 파일을 다음과 같이 수정한다. // tsconfig.json { "compilerOptions": { "module": "commonjs", "target"..
이번 포스트에서는 타입스크립트의 class에 대해 알아본다. // index.ts class Human { public name: string; public age: number; public gender: string; constructor(name: string, age: number, gender: string){ this.name = name; this.age = age; this.gender =gender; } } const lynn = new Human("Lynn", 18, "female"); const sayHi = (person: Human): string => { return `Hello ${person.name}, you are ${person.age}, you are a ${perso..
이번 포스트에서는 interface에 대해 알아본다. 대부분의 경우, 데이터를 Object 형태로 넘겨준다. 이를 사용하기 위해서 사용되는 개념이 interface로 완성된 예제 코드는 아래와 같다. // index.ts interface Human { name: string; age: number; gender: string; } const person = { name: "HBC", age: 26, gender: "male" } const sayHi = (person: Human): string => { return `Hello ${person.name}, you are ${person.age}, you are a ${person.gender}`; }; console.log(sayHi(person));..

이번 포스트에서는 타입에 대해 살펴본다. 1. 간단 실행 우선, 실제로 타입스크립트를 실행했을 때 자바스크립트와의 차이점을 알아본다. index.ts의 내용을 다음과 같이 변경한다. // index.ts const name = "HBC", age = 26, gender = "male"; const sayHi = (name, age, gender) => { console.log(`Hello ${name}, you are ${age}, you are a ${gender}`); }; sayHi(name, age, gender); export {}; 위 코드를 자바스크립트로 실행한다 생각해보면, 자바스크립트에서는 name, age, gender 중 하나가 빠진 채로 sayHi를 실행해도 undefined로 내용..

이번 포스트에서는 타입스크립트에 대해 알아본다. 1. 간단 개념 타입스크립트는 확장된 자바스크립트로 정적 타입 언어이다. 기존의 자바스크립트는 엄격한 규칙이 없어, 사용하기 쉽고, 수정이 자유롭다는 점이 장점이다. 하지만, 이는 팀 프로젝트 혹은 규모가 큰 프로젝트를 진행할 때는 단점으로 작용해 버그를 잡기가 힘들어진다. 이를 해결하기 위해 탄생한 것이 타입스크립트로 예측 가능하고 읽기 쉽게끔 자바스크립트에 규칙을 부여한 것으로 생각하면 쉽다. 2. 설치 apt에서 node-typescript를 설치한다. $> sudo apt install node-typescript npm을 통해 타입스크립트를 설치한다. $> npm i typescript 3. 폴더 생성 및 index.ts 파일 생성 타입스크립트를 ..