IT/DEV Study

[Nomad Coders] TypeScript로 블록체인 만들기 #1, #2 정리

Ella.J 2022. 6. 15. 15:46
728x90
반응형

노마드 코더 무료 강의

타입스크립트로 블록체인 만들기 강의 정리 포스팅

https://nomadcoders.co/typescript-for-beginners

 

타입스크립트로 블록체인 만들기 – 노마드 코더 Nomad Coders

Typescript for Beginners

nomadcoders.co

 

#1 INTRODUCTION

#1.1 ❤무료 강의❤

#1.2 Welcome

#1.3 Who Should Take This Course

#1.4 Software Requirements

#1.5 Why not JavaScript

 

전반적인 TS, 강의 소개 타임.

C# 개발자(나님)는 Type 안정성에 익숙함.

JAVA C# 개발자가 프론트엔드 개발할 때 JavaScript는 타입 안정성이 없기 때문에,

TypeScript를 이용하는 게 편함. RIGHT!


#TypeScript 설치 및 환경설정

Node.js 설치 필요.

https://nodejs.org/ko/download/

각자 사용하는 OS, 환경에 따라 Installer를 다운로드한다.

설치가 끝나고 나면, cmd에서 [>node -v] 버전을 확인한다.


#TypeScript 사용해보기

TS 사용할 directory에서 npm module 설치

[>npm i -g typescript] 혹은 [>npm i -D typescript]

myFirstTypescript.ts 파일을 하나 만들고,

프롬프트에서 컴파일하기 [tsc myFirstTypescript.ts]

컴파일하면 js 파일이 생성됨.


#2 OVERVIEW OF TYPESCRIPT

#2.0 How Typescript Works

타입스크립트는 타입 안정성 덕분에 런타임 에러가 . => 생산성이 높아짐.

-

자바스크립트 에서는 [1, 2, 3, 4] + false 결과값이 '1,2,3,4,false' 로 .

Int 배열과 boolean 더했는데 string으로 나옴. (?)

이렇게 쓰는 사람들이야 없겠지만 저렇게 가능성이 있다...

-

function divide(a, b) {

    return a / b

}

여기선 divide("xxx") 이렇게 입력 값을 하나만 보내도 함수는 실행되고 리턴 값이 NaN으로 .

이렇게 type 간에 계산식이나 코드 실행을 막아 주는 것이 없음.

Const nico = {name: "nico"}

nico.hello() 이러면 실행할 에러가 .

C#에서는 상상도 없는 일임.

-

작성한 타입스크립트는 컴파일하면 자바스크립트로 변환됨.

그냥 TS를 안 쓰는 이유는 브라우저가 JS를 이해하기 때문.

Node.js 타입스크립트와 자바스크립트 모두를 이해함.


#2.1 Implicit Types vs Explicit Types

#2.2-2.4 Types of TS

-

#Implicit Types vs Explicit Types

타입스크립트에서의 데이터 타입

let a = "hello" => a 는 string이라고 추론

let b : boolean = true => 데이터 타입 명시

(명시적 표현은최소한으로 하는 편함, 보기에도 쉽고 타이핑이 최소화됨)

-

#optional type

const player : {

    name:string,

    age?:number

} = {

    name:"nico"

}

age 있거나 없거나 가능

-

#Alias type
여려멍의 player
생성하려면 쓰기 힘듬

type Player = {

    name:string,

    age?:number

}

Alias type을 선언해주고

const nico : Player = {

    name:"nico"

}

이렇게 쓰는 편함.

-

#function return type

function playerMaker(name:string):Player {

    return {

        name

    }

}

const nico = playerMaker("nico")

nico.age = 12

-

const playerMaker = (name:string) : Player => ({name})

이렇게 함수생성해줘도 .

-

#readonly

type Player = {

    readonly name:string,

    age?:number

}

readonly 추가할수도 있음

JS에서는 readonly 없음

-

#Tuple

const player: [string, number, boolean] = ["nico", 1, true]

-

#Undefined, Null

let a : undefined = undefined

let b : null = null

-

#Any

=> any type, any thing

ts로부터 보호장치를 잃어버림. ts에서 빠져나오는 방법. js에서 가능.

const a : any[] = [1, 2, 3, 4]

const b : any = true

a + b 가능

근데 자주 쓰는 것은 안좋고, 꼭 필요할 , ts에서 예외로 하고 싶을 .

-

#Type Checker

let a: unknown;

if (typeof a === 'number') {

    let b = a + 1

}

if (typeof a === 'string') {

    let b = a.toUpperCase();

}

-

#Void

C#이랑 같음. 함수 return 값이 없음.

function hello() {

    console.log('x')

}

-

#Never

return 하지 않고 예외발생 => 사용하지 않을 ?

function hello():never {

    throw new Error("xxx")

}

마지막 else 구문은 never 절대 들어가지 않음

function hello(name:string|number) {

    if (typeof name === 'string') {

        name

    } else if (typeof name === 'number') {

        name

    } else {

        name

    }

}


다음강의 보러가기.

2022.06.15 - [IT] - [Nomad Coders] TypeScript로 블록체인 만들기 #3 정리

 

[Nomad Coders] TypeScript로 블록체인 만들기 #3 정리

#3 FUNCTIONS #3.0 Call Signatures 위에 있는 것이 Call Signatures type Add = (a:number, b:number) => number; const add:Add = (a, b) => a+b 이런식으로 Signature type을 만들 수 있음. #3.1 Overloading..

ella-devblog.tistory.com

 

728x90
반응형